WO2016101755A1 - Drag-and-drop operation-based method and device for adjusting location of object in cross pages - Google Patents

Drag-and-drop operation-based method and device for adjusting location of object in cross pages Download PDF

Info

Publication number
WO2016101755A1
WO2016101755A1 PCT/CN2015/095469 CN2015095469W WO2016101755A1 WO 2016101755 A1 WO2016101755 A1 WO 2016101755A1 CN 2015095469 W CN2015095469 W CN 2015095469W WO 2016101755 A1 WO2016101755 A1 WO 2016101755A1
Authority
WO
WIPO (PCT)
Prior art keywords
page
target object
drag
drag operation
related information
Prior art date
Application number
PCT/CN2015/095469
Other languages
French (fr)
Chinese (zh)
Inventor
胡尊杰
Original Assignee
北京奇虎科技有限公司
奇智软件(北京)有限公司
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by 北京奇虎科技有限公司, 奇智软件(北京)有限公司 filed Critical 北京奇虎科技有限公司
Publication of WO2016101755A1 publication Critical patent/WO2016101755A1/en

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0484Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
    • G06F3/0486Drag-and-drop
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/90Details of database functions independent of the retrieved data types
    • G06F16/95Retrieval from the web
    • G06F16/957Browsing optimisation, e.g. caching or content distillation

Definitions

  • the present invention relates to the field of computer technology, and in particular, to a method and apparatus for adjusting an object position across pages according to a drag operation.
  • a web page is a basic element of a website and a platform for hosting various web applications.
  • the web page is stored in a network device (such as a server) connected to the Internet.
  • the webpage is identified and accessed via a URL (Uniform Resource Locator).
  • URL Uniform Resource Locator
  • the target object can be adjusted by dragging and dropping to realize the personalized setting of the webpage by the user, thereby satisfying different operating habits and needs of different users.
  • the above technical effects cannot be achieved in target object adjustment across pages.
  • the present invention has been made in order to provide a method and apparatus for adjusting an object position across pages based on a drag operation that overcomes the above problems or at least partially solves the above problems.
  • a method for adjusting an object position across pages according to a drag operation including:
  • a new target object is created and displayed in the second page, and the target object in the first page is hidden.
  • an apparatus for adjusting an object position across pages according to a drag operation comprising:
  • An object information determining module configured to determine target object related information related to the dragging when the drag operation of dragging the target object in the first page to the second page is detected;
  • a delivery module configured to transfer target object related information from the first page to the second page based on a predetermined inter-page communication manner
  • a display module configured to create and display a new target object in the second page according to the information related to the target object, and hide the target object in the first page.
  • a computer program comprising computer readable code that, when executed on a computing device, causes the computing device to perform drag based dragging as described above A method of adjusting the position of an object across pages.
  • a computer readable medium storing a computer program as described above.
  • the target object in the first page is dragged to the second page for display by inter-page communication, and the solution for dragging the target object across the pages is provided, and the user can drag ⁇ Operation adjusts the target object between different pages to achieve a smooth transition visual effect from the first page to the second page, and realizes personalized page setting of the user across the page to meet different operating habits of different users. And the demand, while providing users with a practical and convenient visual drag and drop operation experience.
  • FIG. 1 is a schematic flow chart of an embodiment of a method for adjusting an object position across pages according to a drag and drop operation according to the present invention
  • FIG. 2 is a schematic structural diagram of an embodiment of an apparatus for adjusting an object position across pages according to a drag and drop operation according to the present invention
  • FIG. 3 is a block diagram schematically showing a computing device for performing a method of adjusting an object position across pages according to a drag operation according to the present invention
  • Fig. 4 schematically shows a storage unit for holding or carrying program code implementing a method of adjusting an object position across pages according to a drag operation according to the present invention.
  • an embodiment of the present invention provides a A method and apparatus for adjusting an object position across pages according to a drag operation.
  • FIG. 1 is a schematic flow chart of an embodiment of a method for adjusting an object position across pages according to a drag and drop operation according to the present invention.
  • the method according to the invention comprises a step S110, a step S120 and a step S130 performed by the user equipment.
  • the user equipment includes, but is not limited to, any electronic product that can interact with the user through a keyboard, a mouse, a remote controller, a touch panel, or a voice control device, for example, a personal computer, a tablet computer, a smart phone, or a PDA. Wait.
  • Step S110 When detecting a drag operation of dragging the target object in the first page to the second page, determining target object related information related to the drag;
  • Step S120 Transfer the target object related information from the first page to the second page based on the predetermined inter-page communication manner
  • Step S130 Create and display a new target object in the second page according to the target object related information, while hiding the target object in the first page.
  • a solution for dragging the target object across the pages is provided, and the user can perform different operations by dragging and dropping.
  • the position adjustment of the target object between the pages is achieved, and the smooth transition visual effect of dragging the object from the first page to the second page is achieved, and the personalized page setting of the user across the page is realized, which satisfies different operating habits and needs of different users, and simultaneously Provide users with a practical and convenient visual drag and drop operation experience.
  • step S110 when the drag operation of dragging the target object in the first page to the second page is detected, the target object related information related to the drag is determined.
  • the target object includes elements displayed on the page, including but not limited to selected text, hyperlinks, pictures, multimedia information, function keys, and the like.
  • the specific manner of detecting the drag operation may be: determining whether the user performs a drag operation by using a predetermined determination rule, wherein the determination rule may be that the drag distance is greater than a preset distance and/or the drag time is greater than a preset time.
  • the specific manner of detecting the drag operation of dragging the target object in the first page to the second page may be: determining the drag start point coordinates of the mouse press during the mouse dragging process by detecting the moving operation of the mouse
  • the mouse reaches the edge coordinate of the edge of the first page. If it detects that the mouse reaches the first edge coordinate of the edge of the first page, the mouse release operation is not performed, and the drag operation is continuously performed, and the dragging is continued until the edge of the second page is reached.
  • the two pages determine the edge coordinates of the edge of the second page when entering the second page, and then, when detecting that the mouse performs the release operation in the second page, determine the drag drop coordinates of the drag release point.
  • the target calculates the difference between the coordinates of the drag drop point and the coordinates of the drag start point, that is, determines the offset value of the dragged coordinates and the coordinates before the drag, by calculating the coordinates of the target object before dragging and adding the offset
  • the value is the coordinates of the target object after the drag. If the determined position coordinate is relative to the coordinates of the two pages, the first drag offset value of the drag start point coordinate to the first edge coordinate in the first page is calculated, and the second page drags the drop point coordinate to the second page. a second drag offset value of the edge coordinate, and a difference between the first edge coordinate of the first page and the second edge coordinate of the first page relative to the screen; thereby determining the coordinates of the target object after the drag.
  • the first page and the second page when the first page and the second page are sub-pages belonging to the same main page based on an HTML (HyperText Markup Language) iframe, the first page and the second page pass JavaScript (literally translated scripting language) Implementing inter-page communication; here, a page contains a window object, the window object contains a document object, and the document object contains several HTML DOM (Document Object Model) elements node. Node elements (also called nodes) also nest other window objects, ie iframe nodes.
  • the first page and the second page implement inter-page communication through the page server.
  • step S120 the target object related information is transmitted from the first page to the second page based on the predetermined inter-page communication mode.
  • the target object related information includes but is not limited to:
  • Content data of the target object such as text information, picture information, function parameters, feature descriptions, etc. included in the target object;
  • Display effect parameters of the target object such as display color information, size information, visual style information, etc. of the target object;
  • the network identifier of the target object such as the network identifier ID of the target object on the server side.
  • step S120 (refer to FIG. 1) includes step S121 (not shown), and in step S121, communication is based on the HTML iframe page.
  • the mechanism passes the target object related information from the first page to the second page through the main page.
  • the subpage is the same domain link or the cross domain link as the main page; for example, when the subpage and the main page are the same domain link, based on JavaScript,
  • the mutual calling of the parent page and the child page transfers the information related to the target object from the first page to the second page through the main page.
  • the parent page can call the subpage by: FrameName.window.childMethod(), and the method of calling the parent page of the subpage can be: parent.window.parentMethod(), after obtaining the window.document object of the page, Access to the DOM elements in it.
  • step S120 (refer to FIG. 1) includes step S1201 (not shown) and step S1202 (Fig. Not shown).
  • step S1201 the second page related directory stored locally is determined according to the second page; in step S1202, the target object related information is received by using the iframe tag element of the second page in the first page, and the target object is related
  • the information is stored in a directory associated with the second page for use by the second page.
  • the first page is a source domain name page
  • the second page is a target domain name page
  • the target object related information is specified by the second page.
  • step S120 (refer to FIG. 1) includes step S1203 (not shown), in step S1203, drag and drop related information from the first page through the web server Pass to the second page.
  • the user equipment sends a drag information delivery request to the webpage server, where the drag information delivery request includes drag and drop related information, a first page identifier ID, a second side identifier ID, and the drag and drop related information is transmitted from the first page.
  • the web server receives the drag information delivery request, and returns, to the user equipment, page data update information that points to the second page, the page data update information includes drag and drop related information; the user equipment receives the The page data update information is passed to the second page by the browser.
  • step S130 a new target object is created and displayed in the second page according to the target object related information, while the target object in the first page is not displayed.
  • the content information of the target object included in the target object related information such as text information, picture information, function parameters, feature descriptions, and display effect parameters of the target object, such as display color information, size information, and style information of the target object
  • the page technology such as JavaScript, CSS (Cascading Style Sheets)
  • a new target object corresponding to the target object is created in the second page, and the display effect and function of the new target object are the same as the target object
  • Delete the related parameters of the target object recorded in the HTML file corresponding to the first page for example, through HTMLElement.remove() in the JS (JavaScript, Literal Scripting Language) API (Application Programming Interface), Display the target object in the first page; or set the display property of the target object on the first page to be hidden by CSS page technology, for example, by setting the display parameter in the CSS to none.
  • the target object in the first page is not displayed, and the moving object of the mouse is followed, and the target object following the mouse movement is displayed in real time until When the mouse performs a release operation, a new target object is created and displayed in the second page.
  • the method further comprises a step S150 (shown in the figure) and a step S160 (shown in the figure) performed by the user equipment; in step S150, determining the drag operation As a result, wherein the drag operation result includes the network identifier of the target object; in step S160, the drag operation result is transmitted to the web server for updating the first page and the second page.
  • the user equipment extracts the new target object in the first page by reading the HTML file of the second page. Determining the result of the drag operation, wherein the drag operation result includes the network identifier of the target object; subsequently, the drag operation result is sent to the web server for updating the first page and the second page After the web server receives the result of the drag operation, according to the network identifier of the target object, the data related to the target object in the HTML file of the first page is written into the HTML file of the second page, and the HTML file of the first page is deleted. The target object related data, updating the first page and the second page.
  • FIG. 2 is a schematic structural view of an embodiment of an apparatus for adjusting an object position across pages according to a drag operation according to the present invention.
  • the apparatus for adjusting an object position across pages according to a drag operation includes an object information determination module 210, a delivery module 220, and a display module 230.
  • the object information determining module 210 detects the drag operation of dragging the target object in the first page to the second page, determining the target object related information related to the dragging; the delivery module 220 is based on the predetermined inter-page communication manner. And transmitting the target object related information from the first page to the second page; the display module 230 creates and displays the new target object in the second page according to the target object related information, and hides the target object in the first page.
  • a solution for dragging the target object across the pages is provided, and the user can perform different operations by dragging and dropping.
  • the position adjustment of the target object between the pages is achieved, and the smooth transition visual effect of dragging the object from the first page to the second page is achieved, and the personalized page setting of the user across the page is realized, which satisfies different operating habits and needs of different users, and simultaneously Provide users with a practical and convenient visual drag and drop operation experience.
  • the object information determination module 210 detects a drag operation of dragging the target object in the first page to the second page, the target object related information related to the drag is determined.
  • the target object includes elements displayed on the page, including but not limited to selected text, hyperlinks, pictures, multimedia information, function keys, and the like.
  • the specific manner of detecting the drag operation may be: determining whether the user performs a drag operation by using a predetermined determination rule, wherein the determination rule may be that the drag distance is greater than a preset distance and/or the drag time is greater than a preset time.
  • the specific manner of detecting the drag operation of dragging the target object in the first page to the second page may be: determining the drag start point coordinates of the mouse press during the mouse dragging process by detecting the moving operation of the mouse
  • the mouse reaches the edge coordinate of the edge of the first page. If it detects that the mouse reaches the first edge coordinate of the edge of the first page, the mouse release operation is not performed, and the drag operation is continuously performed, and the dragging is continued until the edge of the second page is reached.
  • the two pages determine the edge coordinates of the edge of the second page when entering the second page, and then, when detecting that the mouse performs the release operation in the second page, determine the drag drop coordinates of the drag release point.
  • the determined position coordinate is relative to the coordinates of the screen, calculate the difference between the drag drop coordinate and the drag start coordinate, that is, determine the offset value of the dragged coordinate and the drag front coordinate, and drag and drop by calculation
  • the coordinates of the front target object plus the offset value are the coordinates of the target object after the drag.
  • the determined position coordinate is relative to the coordinates of the two pages, the first drag offset value of the drag start point coordinate to the first edge coordinate in the first page is calculated, and the second page drags the drop point coordinate to the second page.
  • a second drag offset value of the edge coordinate and a difference between the first edge coordinate of the first page and the second edge coordinate of the first page relative to the screen; thereby determining the coordinates of the target object after the drag.
  • the first page and the second page when the first page and the second page are sub-pages belonging to the same main page based on the HTML iframe, the first page and the second page implement inter-page communication through JavaScript; here, one page includes a window object (window) ), the window object contains a document object (document), the document object contains several HTML DOM elements node. Node elements (also called nodes) also nest other window objects, ie iframe nodes.
  • the first page and the second page When the first page and the second page are two separate pages, the first page and the second page implement inter-page communication through the page server.
  • the delivery module 220 passes the target object related information from the first page to the second page based on the predetermined inter-page communication manner.
  • the target object related information includes but is not limited to:
  • Content data of the target object such as text information, picture information, function parameters, feature descriptions, etc. included in the target object;
  • Display effect parameters of the target object such as display color information, size information, visual style information, etc. of the target object;
  • the network identifier of the target object such as the network identifier ID of the target object on the server side.
  • the delivery module 220 transmits the target object related information from the first page to the second page through the main page based on the HTML iframe page communication mechanism.
  • the subpage is the same domain link or the cross domain link as the main page; for example, when the subpage and the main page are the same domain link, based on JavaScript,
  • the mutual calling of the parent page and the child page transfers the information related to the target object from the first page to the second page through the main page.
  • the parent page can call the subpage by: FrameName.window.childMethod(), and the method of calling the parent page of the subpage can be: parent.window.parentMethod(), after obtaining the window.document object of the page, Access to the DOM elements in it.
  • the delivery module 220 (refer to FIG. 2) includes a directory lookup unit (not shown) and an information storage unit (not shown).
  • a directory search unit configured to determine, according to the second page, a directory related to the second page stored locally; and an information storage unit, configured to receive information about the target object by using an iframe tag element of the second page in the first page, and The target object related information is stored in a directory related to the second page for use by the second page.
  • the first page is a source domain name page
  • the second page is a target domain name page
  • the target object related information is specified by the second page.
  • the delivery module 220 passes the drag related information from the first page to the second page through the web server.
  • the user equipment sends a drag information delivery request to the webpage server, where the drag information delivery request includes drag and drop related information, a first page identifier ID, a second side identifier ID, and the drag and drop related information is transmitted from the first page.
  • the web server receives the drag information delivery request, and returns, to the user equipment, page data update information that points to the second page, the page data update information includes drag and drop related information; the user equipment receives the The page data update information is passed to the second page by the browser.
  • the display module 230 creates and displays a new target object in the second page according to the target object related information, while not displaying the target object in the first page.
  • the content information of the target object included in the target object related information such as text information, picture information, function parameters, feature descriptions, and display effect parameters of the target object, such as display color information, size information, and style information of the target object Wait, through the page technology such as JavaScript, CSS, create a new target object corresponding to the target object in the second page, the display effect and function of the new target object are the same as the target object; meanwhile, by the HTML file corresponding to the first page
  • the related parameters of the recorded target object are deleted, for example, through the HTMLElement.remove() in the JS API, the target object in the first page is not displayed; or the display property of the target object in the first page is set to CSS page technology to Hidden, as achieved by setting the display parameter in the CSS to none.
  • the target object in the first page is not displayed, and the moving object of the mouse is followed, and the target object following the mouse movement is displayed in real time until When the mouse performs a release operation, a new target object is created and displayed in the second page.
  • a result determination module (shown in the figure) and a transmission module (shown in the figure) are further included; the result determination module determines a drag operation result, wherein the drag operation result The network identifier of the target object is included; then, the sending module sends the drag operation result to the web server for updating the first page and the second page.
  • the result determining module determines the drag operation result by reading the HTML file of the second page, extracting the position parameter of the new target object in the second page, and the like, wherein the drag operation result includes the network identifier of the target object. Then, the sending module sends the drag operation result to the web server for updating the first page and the second page; after the web server receives the drag operation result, the first page is determined according to the network identifier of the target object.
  • the data related to the target object in the HTML file is written into the second page HTML file, and the data related to the target object in the HTML file of the first page is deleted, and the first page and the second page are updated.
  • modules in the devices of the embodiments can be adaptively changed and placed in one or more devices different from the embodiment.
  • the modules or units or components of the embodiments may be combined into one module or unit or component, and further they may be divided into a plurality of sub-modules or sub-units or sub-components.
  • any combination of the features disclosed in the specification, including the accompanying claims, the abstract and the drawings, and any methods so disclosed, or All processes or units of the device are combined.
  • Each feature disclosed in this specification (including the accompanying claims, the abstract and the drawings) may be replaced by alternative features that provide the same, equivalent or similar purpose.
  • the various component embodiments of the present invention may be implemented in hardware, or in a software module running on one or more processors, or in a combination thereof.
  • a microprocessor or digital signal processor may be used in practice to implement some or all of the components of the apparatus for adjusting the position of an object across pages based on drag and drop operations in accordance with embodiments of the present invention.
  • the invention can also be implemented as a device or device program (e.g., a computer program and a computer program product) for performing some or all of the methods described herein.
  • Such a program implementing the invention may be stored on a computer readable medium or may be in the form of one or more signals. Such signals may be downloaded from an Internet website, provided on a carrier signal, or provided in any other form.
  • FIG. 3 illustrates a computing device that can implement a method of adjusting an object location across pages based on a drag operation.
  • the computing device conventionally includes a computer program product in the form of a processor 310 and a memory 320 or computer readable medium.
  • the memory 320 may be an electronic memory such as a flash memory, an EEPROM (Electrically Erasable Programmable Read Only Memory), an EPROM, a hard disk, or a ROM.
  • the memory 320 has a storage space 330 that stores program code 331 for performing any of the method steps described above.
  • storage space 330 storing program code may include various program code 331 for implementing various steps in the above methods, respectively.
  • the program code can be read from or written to one or more computer program products.
  • These computer program products include program code carriers such as hard disks, compact disks (CDs), memory cards or floppy disks.
  • Such computer program products are typically portable or fixed storage units such as those shown in FIG.
  • the storage unit may have storage segments, storage spaces, and the like that are similarly arranged to memory 320 in the computing device of FIG.
  • the program code can be compressed, for example, in an appropriate form.
  • the storage unit includes computer readable code 331' for performing the method steps of the present invention, ie, code that can be read by a processor, such as 310, that when executed by the computing device causes the computing device to execute Each of the steps in the method described above.

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • General Engineering & Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Human Computer Interaction (AREA)
  • Databases & Information Systems (AREA)
  • Data Mining & Analysis (AREA)
  • User Interface Of Digital Computer (AREA)
  • Information Transfer Between Computers (AREA)

Abstract

The present invention provides a drag-and-drop operation-based method and device for adjusting the location of an object in cross pages. The method comprises: when a drag-and-drop operation of dragging a target object in a first page to a second page is detected, determining target object-related information related to the dragging and dropping; transmitting the target object-related information from the first page to the second page according to a preset cross-page communication mode; creating and displaying a new target object in the second page according to the target object-related information, and at the same time, hiding the target object in the first page. The present invention provides a solution for dragging and dropping a target object in cross pages, a user can adjust the location of the target object in across pages by performing drag-and-drop operations, thereby realizing a cross-page personalized page setup of the user, meeting different operating habits and demands of different users, and at the same time, providing practical and convenient visual drag-and-drop operation experience for users.

Description

基于拖拽操作跨页面调整对象位置的方法和装置Method and apparatus for adjusting object position across pages based on drag and drop operations 技术领域Technical field
本发明涉及计算机技术领域,具体而言,本发明涉及基于拖拽操作跨页面调整对象位置的方法和装置。The present invention relates to the field of computer technology, and in particular, to a method and apparatus for adjusting an object position across pages according to a drag operation.
背景技术Background technique
网页是构成网站的基本元素,是承载各种网站应用的平台。网页存放在与互联网相连的网络设备(如服务器)中。网页经由URL(Uniform Resource Locator,统一资源定位符)来识别与存取,当用户在浏览器输入网址后,经过一段复杂而又快速的程序,网页文件会被传送到用户所在的计算机,然后再通过浏览器解释网页的内容,并展示在用户眼前。A web page is a basic element of a website and a platform for hosting various web applications. The web page is stored in a network device (such as a server) connected to the Internet. The webpage is identified and accessed via a URL (Uniform Resource Locator). After the user enters the web address in the browser, after a complicated and fast procedure, the webpage file is transmitted to the user's computer, and then Explain the content of the web page through the browser and display it in front of the user.
在实际的应用中,对于同一页面,可通过拖拽来对目标对象进行位置调整,以实现用户对于网页的个性化设置,从而满足不同用户的不同操作习惯及需求。然而,上述技术效果无法在跨页面的目标对象调整中实现。In the actual application, for the same page, the target object can be adjusted by dragging and dropping to realize the personalized setting of the webpage by the user, thereby satisfying different operating habits and needs of different users. However, the above technical effects cannot be achieved in target object adjustment across pages.
发明内容Summary of the invention
鉴于上述问题,提出了本发明以便提供一种克服上述问题或者至少部分地解决上述问题的基于拖拽操作跨页面调整对象位置的方法和装置。In view of the above problems, the present invention has been made in order to provide a method and apparatus for adjusting an object position across pages based on a drag operation that overcomes the above problems or at least partially solves the above problems.
根据本发明的一方面,提供了一种基于拖拽操作跨页面调整对象位置的方法,包括:According to an aspect of the present invention, a method for adjusting an object position across pages according to a drag operation is provided, including:
检测到将第一页面中的目标对象拖拽至第二页面的拖拽操作时,确定与拖拽相关的目标对象相关信息;When the drag operation of dragging the target object in the first page to the second page is detected, determining related information of the target object related to the dragging;
基于预定的页面间通信方式,将目标对象相关信息从第一页面传递至第二页面;Transmitting the target object related information from the first page to the second page based on the predetermined inter-page communication manner;
根据目标对象相关信息,在第二页面中创建并显示新目标对象,同时隐藏第一页面中的目标对象。According to the target object related information, a new target object is created and displayed in the second page, and the target object in the first page is hidden.
根据本发明的另一方面,还提供了一种基于拖拽操作跨页面调整对象位置的装置,包括:According to another aspect of the present invention, there is also provided an apparatus for adjusting an object position across pages according to a drag operation, comprising:
对象信息确定模块,用于检测到将第一页面中的目标对象拖拽至第二页面的拖拽操作时,确定与拖拽相关的目标对象相关信息;An object information determining module, configured to determine target object related information related to the dragging when the drag operation of dragging the target object in the first page to the second page is detected;
传递模块,用于基于预定的页面间通信方式,将目标对象相关信息从第一页面传递至第二页面; a delivery module, configured to transfer target object related information from the first page to the second page based on a predetermined inter-page communication manner;
显示模块,用于根据目标对象相关信息,在第二页面中创建并显示新目标对象,同时隐藏第一页面中的目标对象。a display module, configured to create and display a new target object in the second page according to the information related to the target object, and hide the target object in the first page.
根据本发明的又一方面,提供了一种计算机程序,其包括计算机可读代码,当所述计算机可读代码在计算设备上运行时,导致所述计算设备执行如上文所述的基于拖拽操作跨页面调整对象位置的方法。According to still another aspect of the present invention, a computer program is provided, comprising computer readable code that, when executed on a computing device, causes the computing device to perform drag based dragging as described above A method of adjusting the position of an object across pages.
根据本发明的再一方面,提供了一种计算机可读介质,其中存储了如上文所述的计算机程序。According to still another aspect of the present invention, there is provided a computer readable medium storing a computer program as described above.
本发明的有益效果为:The beneficial effects of the invention are:
在本发明提供的实施例中,通过页面间通信实现了将第一页面中的目标对象拖拽至第二页面进行显示,提供了跨页面间的目标对象拖拽的解决方案,用户可通过拖拽操作在不同页面之间对目标对象进行位置调整,达成从第一页面拖拽对象到第二页面的平滑过渡视觉效果,实现了用户跨页面的个性化页面设置,满足不同用户的不同操作习惯及需求,同时为用户提供了实用便利的可视化拖拽操作体验。In the embodiment provided by the present invention, the target object in the first page is dragged to the second page for display by inter-page communication, and the solution for dragging the target object across the pages is provided, and the user can drag拽Operation adjusts the target object between different pages to achieve a smooth transition visual effect from the first page to the second page, and realizes personalized page setting of the user across the page to meet different operating habits of different users. And the demand, while providing users with a practical and convenient visual drag and drop operation experience.
上述说明仅是本发明技术方案的概述,为了能够更清楚了解本发明的技术手段,而可依照说明书的内容予以实施,并且为了让本发明的上述和其它目的、特征和优点能够更明显易懂,以下特举本发明的具体实施方式。The above description is only an overview of the technical solutions of the present invention, and the above-described and other objects, features and advantages of the present invention can be more clearly understood. Specific embodiments of the invention are set forth below.
附图说明DRAWINGS
通过阅读下文优选实施方式的详细描述,各种其他的优点和益处对于本领域普通技术人员将变得清楚明了。附图仅用于示出优选实施方式的目的,而并不认为是对本发明的限制。而且在整个附图中,用相同的参考符号表示相同的部件。在附图中:Various other advantages and benefits will become apparent to those skilled in the art from a The drawings are only for the purpose of illustrating the preferred embodiments and are not to be construed as limiting. Throughout the drawings, the same reference numerals are used to refer to the same parts. In the drawing:
图1为本发明中基于拖拽操作跨页面调整对象位置的方法一个实施例的流程示意图;1 is a schematic flow chart of an embodiment of a method for adjusting an object position across pages according to a drag and drop operation according to the present invention;
图2为本发明中基于拖拽操作跨页面调整对象位置的装置一个实施例的结构示意图;2 is a schematic structural diagram of an embodiment of an apparatus for adjusting an object position across pages according to a drag and drop operation according to the present invention;
图3示意性地示出了用于执行根据本发明的基于拖拽操作跨页面调整对象位置的方法的计算设备的框图;以及3 is a block diagram schematically showing a computing device for performing a method of adjusting an object position across pages according to a drag operation according to the present invention;
图4示意性地示出了用于保持或者携带实现根据本发明的基于拖拽操作跨页面调整对象位置的方法的程序代码的存储单元。Fig. 4 schematically shows a storage unit for holding or carrying program code implementing a method of adjusting an object position across pages according to a drag operation according to the present invention.
具体实施方式detailed description
下面结合附图和具体的实施方式对本发明作进一步的描述。 The invention is further described below in conjunction with the drawings and specific embodiments.
为了实现用户对于网页的个性化设置,允许通过简单操作(如拖拽)来对不同页面中的目标对象进行位置调整,从而满足不同用户的不同操作习惯及需求,本发明的实施例提供了一种基于拖拽操作跨页面调整对象位置的方法和装置。In order to realize the personalized setting of the webpage by the user, the positional adjustment of the target object in different pages is allowed to be performed by simple operations (such as drag and drop), thereby satisfying different operating habits and needs of different users, and an embodiment of the present invention provides a A method and apparatus for adjusting an object position across pages according to a drag operation.
图1为本发明中基于拖拽操作跨页面调整对象位置的方法一个实施例的流程示意图。FIG. 1 is a schematic flow chart of an embodiment of a method for adjusting an object position across pages according to a drag and drop operation according to the present invention.
根据本发明的方法包括由用户设备执行的步骤S110、步骤S120和步骤S130。The method according to the invention comprises a step S110, a step S120 and a step S130 performed by the user equipment.
其中,用户设备包括但不限于任何一种可与用户通过键盘、鼠标、遥控器、触摸板、或声控设备等方式进行人机交互的电子产品,例如,个人计算机、平板电脑、智能手机、PDA等。The user equipment includes, but is not limited to, any electronic product that can interact with the user through a keyboard, a mouse, a remote controller, a touch panel, or a voice control device, for example, a personal computer, a tablet computer, a smart phone, or a PDA. Wait.
步骤S110:检测到将第一页面中的目标对象拖拽至第二页面的拖拽操作时,确定与拖拽相关的目标对象相关信息;Step S110: When detecting a drag operation of dragging the target object in the first page to the second page, determining target object related information related to the drag;
步骤S120:基于预定的页面间通信方式,将目标对象相关信息从第一页面传递至第二页面;以及Step S120: Transfer the target object related information from the first page to the second page based on the predetermined inter-page communication manner;
步骤S130:根据目标对象相关信息,在第二页面中创建并显示新目标对象,同时隐藏第一页面中的目标对象。Step S130: Create and display a new target object in the second page according to the target object related information, while hiding the target object in the first page.
本实施例中,通过页面间通信实现了将第一页面中的目标对象拖拽至第二页面进行显示,提供了跨页面间的目标对象拖拽的解决方案,用户可通过拖拽操作在不同页面之间对目标对象进行位置调整,达成从第一页面拖拽对象到第二页面的平滑过渡视觉效果,实现了用户跨页面的个性化页面设置,满足不同用户的不同操作习惯及需求,同时为用户提供了实用便利的可视化拖拽操作体验。In this embodiment, by dragging the target object in the first page to the second page for display by means of inter-page communication, a solution for dragging the target object across the pages is provided, and the user can perform different operations by dragging and dropping. The position adjustment of the target object between the pages is achieved, and the smooth transition visual effect of dragging the object from the first page to the second page is achieved, and the personalized page setting of the user across the page is realized, which satisfies different operating habits and needs of different users, and simultaneously Provide users with a practical and convenient visual drag and drop operation experience.
具体地,在步骤S110中,检测到将第一页面中的目标对象拖拽至第二页面的拖拽操作时,确定与拖拽相关的目标对象相关信息。Specifically, in step S110, when the drag operation of dragging the target object in the first page to the second page is detected, the target object related information related to the drag is determined.
其中,目标对象包括页面中展示的元素,包括但不限于选中的文字、超级链接、图片、多媒体信息、功能按键等。The target object includes elements displayed on the page, including but not limited to selected text, hyperlinks, pictures, multimedia information, function keys, and the like.
检测拖拽操作的具体方式可为:通过预定的判断规则确定用户是否进行拖拽操作,其中,判断规则可以为拖拽距离大于预设的距离和/或拖拽时间大于预设的时间。The specific manner of detecting the drag operation may be: determining whether the user performs a drag operation by using a predetermined determination rule, wherein the determination rule may be that the drag distance is greater than a preset distance and/or the drag time is greater than a preset time.
检测到将第一页面中的目标对象拖拽至第二页面的拖拽操作的具体方式可为:通过检测鼠标的移动操作,实时地确定鼠标拖拽过程中鼠标按下的拖拽起点坐标及鼠标到达第一页面边缘的边缘坐标,若检测到鼠标到达第一页面边缘的第一边缘坐标时未执行鼠标释放操作,且持续执行拖拽操作,并持续拖拽至到达第二页面边缘进入第二页面,确定进入第二页面时第二页面边缘的边缘坐标,随后,当检测到鼠标在第二页面中执行释放操作时,确定拖拽释放落点的拖拽落点坐标。若确定的位置坐标可是相对于屏幕的坐 标,则计算拖拽落点坐标与拖拽起点坐标之间的差值,即确定拖拽后坐标与拖拽前坐标的偏移值,通过计算拖拽前目标对象的坐标加上该偏移值即为拖拽后目标对象的坐标。若确定的位置坐标是相对于两个页面的坐标,则计算第一页面中拖拽起点坐标至第一边缘坐标的第一拖拽偏移值,第二页面中拖拽落点坐标至第二边缘坐标的第二拖拽偏移值,以及第一页面的第一边缘坐标与第一页面的第二边缘坐标相对于屏幕的差值;进而确定拖拽后目标对象的坐标。The specific manner of detecting the drag operation of dragging the target object in the first page to the second page may be: determining the drag start point coordinates of the mouse press during the mouse dragging process by detecting the moving operation of the mouse The mouse reaches the edge coordinate of the edge of the first page. If it detects that the mouse reaches the first edge coordinate of the edge of the first page, the mouse release operation is not performed, and the drag operation is continuously performed, and the dragging is continued until the edge of the second page is reached. The two pages determine the edge coordinates of the edge of the second page when entering the second page, and then, when detecting that the mouse performs the release operation in the second page, determine the drag drop coordinates of the drag release point. If the determined position coordinates are relative to the screen The target calculates the difference between the coordinates of the drag drop point and the coordinates of the drag start point, that is, determines the offset value of the dragged coordinates and the coordinates before the drag, by calculating the coordinates of the target object before dragging and adding the offset The value is the coordinates of the target object after the drag. If the determined position coordinate is relative to the coordinates of the two pages, the first drag offset value of the drag start point coordinate to the first edge coordinate in the first page is calculated, and the second page drags the drop point coordinate to the second page. a second drag offset value of the edge coordinate, and a difference between the first edge coordinate of the first page and the second edge coordinate of the first page relative to the screen; thereby determining the coordinates of the target object after the drag.
其中,当第一页面及第二页面是基于HTML(HyperText Markup Language,超级文本标记语言)iframe的属于同一主页面的子页面时,则第一页面和第二页面通过JavaScript(直译式脚本语言)实现页面间通信;在此,一个页面包含一个窗口对象(window),窗口对象包含一个文档对象(document),文档对象包含若干个HTML DOM(Document Object Model,文档对象模型)元素node。Node元素(也称节点)也嵌套其他window对象,即iframe节点。当第一页面及第二页面是独立的两个页面,则第一页面和第二页面通过页面服务器实现页面间通信。Wherein, when the first page and the second page are sub-pages belonging to the same main page based on an HTML (HyperText Markup Language) iframe, the first page and the second page pass JavaScript (literally translated scripting language) Implementing inter-page communication; here, a page contains a window object, the window object contains a document object, and the document object contains several HTML DOM (Document Object Model) elements node. Node elements (also called nodes) also nest other window objects, ie iframe nodes. When the first page and the second page are two separate pages, the first page and the second page implement inter-page communication through the page server.
在步骤S120中,基于预定的页面间通信方式,将目标对象相关信息从第一页面传递至第二页面。In step S120, the target object related information is transmitted from the first page to the second page based on the predetermined inter-page communication mode.
其中,目标对象相关信息包括但不限于:Among them, the target object related information includes but is not limited to:
目标对象的内容数据,如目标对象包括的文字信息、图片信息、功能参数、特征描述等;Content data of the target object, such as text information, picture information, function parameters, feature descriptions, etc. included in the target object;
目标对象的显示效果参数,如目标对象的显示颜色信息、尺寸信息、视觉样式信息等;Display effect parameters of the target object, such as display color information, size information, visual style information, etc. of the target object;
目标对象的网络标识,如目标对象在服务器端的网络标识ID。The network identifier of the target object, such as the network identifier ID of the target object on the server side.
当第一页面及第二页面是基于HTML iframe的属于同一主页面的子页面时,步骤S120(参照图1)包括步骤S121(图中未示出),在步骤S121中,基于HTML iframe页面通信机制,将目标对象相关信息通过主页面从第一页面传递至第二页面。When the first page and the second page are sub-pages belonging to the same main page based on the HTML iframe, step S120 (refer to FIG. 1) includes step S121 (not shown), and in step S121, communication is based on the HTML iframe page. The mechanism passes the target object related information from the first page to the second page through the main page.
具体地,在HTML iframe框架中,根据iframe中src属性来判断子页面与主页面是同域链接还是跨域链接;例如,当子页面和主页面是同域链接的情况下,基于JavaScript,通过父页面与子页面的相互调用,将目标对象相关信息通过主页面从第一页面传递至第二页面。Specifically, in the HTML iframe framework, according to the src attribute in the iframe, it is determined whether the subpage is the same domain link or the cross domain link as the main page; for example, when the subpage and the main page are the same domain link, based on JavaScript, The mutual calling of the parent page and the child page transfers the information related to the target object from the first page to the second page through the main page.
其中,父页面调用子页面的方法可通过:FrameName.window.childMethod(),子页面调用父页面的方法可通过:parent.window.parentMethod(),在获取到页面的window.document对象后,即可访问其中的DOM元素。The parent page can call the subpage by: FrameName.window.childMethod(), and the method of calling the parent page of the subpage can be: parent.window.parentMethod(), after obtaining the window.document object of the page, Access to the DOM elements in it.
优选地,步骤S120(参照图1)包括步骤S1201(图中未示出)和步骤S1202(图 中未示出)。Preferably, step S120 (refer to FIG. 1) includes step S1201 (not shown) and step S1202 (Fig. Not shown).
在步骤S1201中,依据第二页面确定本地存储的第二页面相关的目录;在步骤S1202中,利用第一页面中的、第二页面的iframe标签元素接收目标对象相关信息,并将目标对象相关信息存储在第二页面相关的目录,以供第二页面使用。其中,第一页面为源域名页面,第二页面为目标域名页面,且目标对象相关信息指定由第二页面使用。In step S1201, the second page related directory stored locally is determined according to the second page; in step S1202, the target object related information is received by using the iframe tag element of the second page in the first page, and the target object is related The information is stored in a directory associated with the second page for use by the second page. The first page is a source domain name page, the second page is a target domain name page, and the target object related information is specified by the second page.
当第一页面及第二页面是独立的两个页面;步骤S120(参照图1)包括步骤S1203(图中未示出),在步骤S1203中,将拖拽相关信息通过网页服务器从第一页面传递至第二页面。When the first page and the second page are two independent pages; step S120 (refer to FIG. 1) includes step S1203 (not shown), in step S1203, drag and drop related information from the first page through the web server Pass to the second page.
具体地,用户设备向网页服务器发送拖拽信息传递请求,该拖拽信息传递请求包括拖拽相关信息、第一页面标识ID、第二面标识ID、将拖拽相关信息从第一页面传递地第二页面的传递指示等信息;网络服务器接收到该拖拽信息传递请求,向用户设备返回指向第二页面的页面数据更新信息,该页面数据更新信息包括拖拽相关信息;用户设备接收到该页面数据更新信息,通过浏览器将拖拽相关信息传递至第二页面。Specifically, the user equipment sends a drag information delivery request to the webpage server, where the drag information delivery request includes drag and drop related information, a first page identifier ID, a second side identifier ID, and the drag and drop related information is transmitted from the first page. Receiving the information indicating the second page; the web server receives the drag information delivery request, and returns, to the user equipment, page data update information that points to the second page, the page data update information includes drag and drop related information; the user equipment receives the The page data update information is passed to the second page by the browser.
在步骤S130中,根据目标对象相关信息,在第二页面中创建并显示新目标对象,同时不显示第一页面中的目标对象。In step S130, a new target object is created and displayed in the second page according to the target object related information, while the target object in the first page is not displayed.
具体地,根据目标对象相关信息包括的目标对象的内容信息,如文字信息、图片信息、功能参数、特征描述,以及目标对象的显示效果参数,如目标对象的显示颜色信息、尺寸信息、样式信息等,通过JavaScript、CSS(Cascading Style Sheets,层叠样式表)等页面技术,在第二页面中创建与目标对象对应的新目标对象,新目标对象的展示效果及功能与目标对象相同;同时,通过将第一页面对应的HTML文件中记录的目标对象的相关参数删除,如,通过JS(JavaScript,直译式脚本语言)API(Application Programming Interface,应用程序编程接口)中的HTMLElement.remove(),不显示第一页面中的目标对象;或通过CSS页面技术,将目标对象在第一页面的显示属性设置为隐藏,如通过对CSS中display参数设置为none来实现。Specifically, the content information of the target object included in the target object related information, such as text information, picture information, function parameters, feature descriptions, and display effect parameters of the target object, such as display color information, size information, and style information of the target object Then, through the page technology such as JavaScript, CSS (Cascading Style Sheets), a new target object corresponding to the target object is created in the second page, and the display effect and function of the new target object are the same as the target object; Delete the related parameters of the target object recorded in the HTML file corresponding to the first page, for example, through HTMLElement.remove() in the JS (JavaScript, Literal Scripting Language) API (Application Programming Interface), Display the target object in the first page; or set the display property of the target object on the first page to be hidden by CSS page technology, for example, by setting the display parameter in the CSS to none.
优选地,在拖拽过程中,通过检测鼠标的移动操作,在鼠标按下时触发不显示第一页面中的目标对象,并跟随鼠标的移动轨迹,实时地显示跟随鼠标移动的目标对象,直至在鼠标执行释放操作时,在第二页面中创建并显示新目标对象。Preferably, during the dragging process, by detecting the moving operation of the mouse, when the mouse is pressed, the target object in the first page is not displayed, and the moving object of the mouse is followed, and the target object following the mouse movement is displayed in real time until When the mouse performs a release operation, a new target object is created and displayed in the second page.
在一优选实施例中(参照图1),该方法还包括由用户设备执行的步骤S150(图中为示出)和步骤S160(图中为示出);在步骤S150中,确定拖拽操作结果,其中,拖拽操作结果包括目标对象的网络标识;在步骤S160中,将拖拽操作结果发送至网页服务器,以用于更新第一页面和第二页面。In a preferred embodiment (refer to FIG. 1), the method further comprises a step S150 (shown in the figure) and a step S160 (shown in the figure) performed by the user equipment; in step S150, determining the drag operation As a result, wherein the drag operation result includes the network identifier of the target object; in step S160, the drag operation result is transmitted to the web server for updating the first page and the second page.
具体地,用户设备通过读取第二页面的HTML文件,提取其中的新目标对象在第 二页面中的位置参数等,确定拖拽操作结果,其中,拖拽操作结果包括目标对象的网络标识;随后,将拖拽操作结果发送至网页服务器,以用于更新第一页面和第二页面;当网页服务器接收到该拖拽操作结果后,根据目标对象的网络标识,将第一页面HTML文件中目标对象相关的数据写入第二页面HTML文件中,并删除第一页面HTML文件中与目标对象相关的数据,更新第一页面和第二页面。Specifically, the user equipment extracts the new target object in the first page by reading the HTML file of the second page. Determining the result of the drag operation, wherein the drag operation result includes the network identifier of the target object; subsequently, the drag operation result is sent to the web server for updating the first page and the second page After the web server receives the result of the drag operation, according to the network identifier of the target object, the data related to the target object in the HTML file of the first page is written into the HTML file of the second page, and the HTML file of the first page is deleted. The target object related data, updating the first page and the second page.
图2为本发明中基于拖拽操作跨页面调整对象位置的装置一个实施例的结构示意图。2 is a schematic structural view of an embodiment of an apparatus for adjusting an object position across pages according to a drag operation according to the present invention.
本发明的实施例中,基于拖拽操作跨页面调整对象位置的装置包括对象信息确定模块210、传递模块220和显示模块230。In an embodiment of the present invention, the apparatus for adjusting an object position across pages according to a drag operation includes an object information determination module 210, a delivery module 220, and a display module 230.
首先,对象信息确定模块210检测到将第一页面中的目标对象拖拽至第二页面的拖拽操作时,确定与拖拽相关的目标对象相关信息;传递模块220基于预定的页面间通信方式,将目标对象相关信息从第一页面传递至第二页面;显示模块230根据目标对象相关信息,在第二页面中创建并显示新目标对象,同时隐藏第一页面中的目标对象。First, when the object information determining module 210 detects the drag operation of dragging the target object in the first page to the second page, determining the target object related information related to the dragging; the delivery module 220 is based on the predetermined inter-page communication manner. And transmitting the target object related information from the first page to the second page; the display module 230 creates and displays the new target object in the second page according to the target object related information, and hides the target object in the first page.
本实施例中,通过页面间通信实现了将第一页面中的目标对象拖拽至第二页面进行显示,提供了跨页面间的目标对象拖拽的解决方案,用户可通过拖拽操作在不同页面之间对目标对象进行位置调整,达成从第一页面拖拽对象到第二页面的平滑过渡视觉效果,实现了用户跨页面的个性化页面设置,满足不同用户的不同操作习惯及需求,同时为用户提供了实用便利的可视化拖拽操作体验。In this embodiment, by dragging the target object in the first page to the second page for display by means of inter-page communication, a solution for dragging the target object across the pages is provided, and the user can perform different operations by dragging and dropping. The position adjustment of the target object between the pages is achieved, and the smooth transition visual effect of dragging the object from the first page to the second page is achieved, and the personalized page setting of the user across the page is realized, which satisfies different operating habits and needs of different users, and simultaneously Provide users with a practical and convenient visual drag and drop operation experience.
具体地,对象信息确定模块210检测到将第一页面中的目标对象拖拽至第二页面的拖拽操作时,确定与拖拽相关的目标对象相关信息。Specifically, when the object information determination module 210 detects a drag operation of dragging the target object in the first page to the second page, the target object related information related to the drag is determined.
其中,目标对象包括页面中展示的元素,包括但不限于选中的文字、超级链接、图片、多媒体信息、功能按键等。The target object includes elements displayed on the page, including but not limited to selected text, hyperlinks, pictures, multimedia information, function keys, and the like.
检测拖拽操作的具体方式可为:通过预定的判断规则确定用户是否进行拖拽操作,其中,判断规则可以为拖拽距离大于预设的距离和/或拖拽时间大于预设的时间。The specific manner of detecting the drag operation may be: determining whether the user performs a drag operation by using a predetermined determination rule, wherein the determination rule may be that the drag distance is greater than a preset distance and/or the drag time is greater than a preset time.
检测到将第一页面中的目标对象拖拽至第二页面的拖拽操作的具体方式可为:通过检测鼠标的移动操作,实时地确定鼠标拖拽过程中鼠标按下的拖拽起点坐标及鼠标到达第一页面边缘的边缘坐标,若检测到鼠标到达第一页面边缘的第一边缘坐标时未执行鼠标释放操作,且持续执行拖拽操作,并持续拖拽至到达第二页面边缘进入第二页面,确定进入第二页面时第二页面边缘的边缘坐标,随后,当检测到鼠标在第二页面中执行释放操作时,确定拖拽释放落点的拖拽落点坐标。若确定的位置坐标可是相对于屏幕的坐标,则计算拖拽落点坐标与拖拽起点坐标之间的差值,即确定拖拽后坐标与拖拽前坐标的偏移值,通过计算拖拽前目标对象的坐标加上该偏移值即为拖拽后目标对象的坐标。 若确定的位置坐标是相对于两个页面的坐标,则计算第一页面中拖拽起点坐标至第一边缘坐标的第一拖拽偏移值,第二页面中拖拽落点坐标至第二边缘坐标的第二拖拽偏移值,以及第一页面的第一边缘坐标与第一页面的第二边缘坐标相对于屏幕的差值;进而确定拖拽后目标对象的坐标。The specific manner of detecting the drag operation of dragging the target object in the first page to the second page may be: determining the drag start point coordinates of the mouse press during the mouse dragging process by detecting the moving operation of the mouse The mouse reaches the edge coordinate of the edge of the first page. If it detects that the mouse reaches the first edge coordinate of the edge of the first page, the mouse release operation is not performed, and the drag operation is continuously performed, and the dragging is continued until the edge of the second page is reached. The two pages determine the edge coordinates of the edge of the second page when entering the second page, and then, when detecting that the mouse performs the release operation in the second page, determine the drag drop coordinates of the drag release point. If the determined position coordinate is relative to the coordinates of the screen, calculate the difference between the drag drop coordinate and the drag start coordinate, that is, determine the offset value of the dragged coordinate and the drag front coordinate, and drag and drop by calculation The coordinates of the front target object plus the offset value are the coordinates of the target object after the drag. If the determined position coordinate is relative to the coordinates of the two pages, the first drag offset value of the drag start point coordinate to the first edge coordinate in the first page is calculated, and the second page drags the drop point coordinate to the second page. a second drag offset value of the edge coordinate, and a difference between the first edge coordinate of the first page and the second edge coordinate of the first page relative to the screen; thereby determining the coordinates of the target object after the drag.
其中,当第一页面及第二页面是基于HTML iframe的属于同一主页面的子页面时,则第一页面和第二页面通过JavaScript实现页面间通信;在此,一个页面包含一个窗口对象(window),窗口对象包含一个文档对象(document),文档对象包含若干个HTML DOM元素node。Node元素(也称节点)也嵌套其他window对象,即iframe节点。当第一页面及第二页面是独立的两个页面,则第一页面和第二页面通过页面服务器实现页面间通信。Wherein, when the first page and the second page are sub-pages belonging to the same main page based on the HTML iframe, the first page and the second page implement inter-page communication through JavaScript; here, one page includes a window object (window) ), the window object contains a document object (document), the document object contains several HTML DOM elements node. Node elements (also called nodes) also nest other window objects, ie iframe nodes. When the first page and the second page are two separate pages, the first page and the second page implement inter-page communication through the page server.
传递模块220基于预定的页面间通信方式,将目标对象相关信息从第一页面传递至第二页面。The delivery module 220 passes the target object related information from the first page to the second page based on the predetermined inter-page communication manner.
其中,目标对象相关信息包括但不限于:Among them, the target object related information includes but is not limited to:
目标对象的内容数据,如目标对象包括的文字信息、图片信息、功能参数、特征描述等;Content data of the target object, such as text information, picture information, function parameters, feature descriptions, etc. included in the target object;
目标对象的显示效果参数,如目标对象的显示颜色信息、尺寸信息、视觉样式信息等;Display effect parameters of the target object, such as display color information, size information, visual style information, etc. of the target object;
目标对象的网络标识,如目标对象在服务器端的网络标识ID。The network identifier of the target object, such as the network identifier ID of the target object on the server side.
当第一页面及第二页面是基于HTML iframe的属于同一主页面的子页面时,传递模块220基于HTML iframe页面通信机制,将目标对象相关信息通过主页面从第一页面传递至第二页面。When the first page and the second page are sub-pages belonging to the same main page based on the HTML iframe, the delivery module 220 transmits the target object related information from the first page to the second page through the main page based on the HTML iframe page communication mechanism.
具体地,在HTML iframe框架中,根据iframe中src属性来判断子页面与主页面是同域链接还是跨域链接;例如,当子页面和主页面是同域链接的情况下,基于JavaScript,通过父页面与子页面的相互调用,将目标对象相关信息通过主页面从第一页面传递至第二页面。Specifically, in the HTML iframe framework, according to the src attribute in the iframe, it is determined whether the subpage is the same domain link or the cross domain link as the main page; for example, when the subpage and the main page are the same domain link, based on JavaScript, The mutual calling of the parent page and the child page transfers the information related to the target object from the first page to the second page through the main page.
其中,父页面调用子页面的方法可通过:FrameName.window.childMethod(),子页面调用父页面的方法可通过:parent.window.parentMethod(),在获取到页面的window.document对象后,即可访问其中的DOM元素。The parent page can call the subpage by: FrameName.window.childMethod(), and the method of calling the parent page of the subpage can be: parent.window.parentMethod(), after obtaining the window.document object of the page, Access to the DOM elements in it.
优选地,传递模块220(参照图2)包括目录查找单元(图中未示出)和信息存储单元(图中未示出)。Preferably, the delivery module 220 (refer to FIG. 2) includes a directory lookup unit (not shown) and an information storage unit (not shown).
目录查找单元,用于依据第二页面确定本地存储的第二页面相关的目录;信息存储单元,用于利用第一页面中的、第二页面的iframe标签元素接收目标对象相关信息,并 将目标对象相关信息存储在第二页面相关的目录,以供第二页面使用。其中,第一页面为源域名页面,第二页面为目标域名页面,且目标对象相关信息指定由第二页面使用。a directory search unit, configured to determine, according to the second page, a directory related to the second page stored locally; and an information storage unit, configured to receive information about the target object by using an iframe tag element of the second page in the first page, and The target object related information is stored in a directory related to the second page for use by the second page. The first page is a source domain name page, the second page is a target domain name page, and the target object related information is specified by the second page.
当第一页面及所述第二页面是独立的两个页面;传递模块220将拖拽相关信息通过网页服务器从第一页面传递至第二页面。When the first page and the second page are two separate pages, the delivery module 220 passes the drag related information from the first page to the second page through the web server.
具体地,用户设备向网页服务器发送拖拽信息传递请求,该拖拽信息传递请求包括拖拽相关信息、第一页面标识ID、第二面标识ID、将拖拽相关信息从第一页面传递地第二页面的传递指示等信息;网络服务器接收到该拖拽信息传递请求,向用户设备返回指向第二页面的页面数据更新信息,该页面数据更新信息包括拖拽相关信息;用户设备接收到该页面数据更新信息,通过浏览器将拖拽相关信息传递至第二页面。Specifically, the user equipment sends a drag information delivery request to the webpage server, where the drag information delivery request includes drag and drop related information, a first page identifier ID, a second side identifier ID, and the drag and drop related information is transmitted from the first page. Receiving the information indicating the second page; the web server receives the drag information delivery request, and returns, to the user equipment, page data update information that points to the second page, the page data update information includes drag and drop related information; the user equipment receives the The page data update information is passed to the second page by the browser.
显示模块230根据目标对象相关信息,在第二页面中创建并显示新目标对象,同时不显示第一页面中的目标对象。The display module 230 creates and displays a new target object in the second page according to the target object related information, while not displaying the target object in the first page.
具体地,根据目标对象相关信息包括的目标对象的内容信息,如文字信息、图片信息、功能参数、特征描述,以及目标对象的显示效果参数,如目标对象的显示颜色信息、尺寸信息、样式信息等,通过JavaScript、CSS等页面技术,在第二页面中创建与目标对象对应的新目标对象,新目标对象的展示效果及功能与目标对象相同;同时,通过将第一页面对应的HTML文件中记录的目标对象的相关参数删除,如,通过JS API中的HTMLElement.remove(),不显示第一页面中的目标对象;或通过CSS页面技术,将目标对象在第一页面的显示属性设置为隐藏,如通过对CSS中display参数设置为none来实现。Specifically, the content information of the target object included in the target object related information, such as text information, picture information, function parameters, feature descriptions, and display effect parameters of the target object, such as display color information, size information, and style information of the target object Wait, through the page technology such as JavaScript, CSS, create a new target object corresponding to the target object in the second page, the display effect and function of the new target object are the same as the target object; meanwhile, by the HTML file corresponding to the first page The related parameters of the recorded target object are deleted, for example, through the HTMLElement.remove() in the JS API, the target object in the first page is not displayed; or the display property of the target object in the first page is set to CSS page technology to Hidden, as achieved by setting the display parameter in the CSS to none.
优选地,在拖拽过程中,通过检测鼠标的移动操作,在鼠标按下时触发不显示第一页面中的目标对象,并跟随鼠标的移动轨迹,实时地显示跟随鼠标移动的目标对象,直至在鼠标执行释放操作时,在第二页面中创建并显示新目标对象。Preferably, during the dragging process, by detecting the moving operation of the mouse, when the mouse is pressed, the target object in the first page is not displayed, and the moving object of the mouse is followed, and the target object following the mouse movement is displayed in real time until When the mouse performs a release operation, a new target object is created and displayed in the second page.
在一优选实施例中(参照图2),还包括结果确定模块(图中为示出)和发送模块(图中为示出);结果确定模块确定拖拽操作结果,其中,拖拽操作结果包括目标对象的网络标识;随后,发送模块将拖拽操作结果发送至网页服务器,以用于更新第一页面和第二页面。In a preferred embodiment (refer to FIG. 2), a result determination module (shown in the figure) and a transmission module (shown in the figure) are further included; the result determination module determines a drag operation result, wherein the drag operation result The network identifier of the target object is included; then, the sending module sends the drag operation result to the web server for updating the first page and the second page.
具体地,结果确定模块通过读取第二页面的HTML文件,提取其中的新目标对象在第二页面中的位置参数等,确定拖拽操作结果,其中,拖拽操作结果包括目标对象的网络标识;随后,发送模块将拖拽操作结果发送至网页服务器,以用于更新第一页面和第二页面;当网页服务器接收到该拖拽操作结果后,根据目标对象的网络标识,将第一页面HTML文件中目标对象相关的数据写入第二页面HTML文件中,并删除第一页面HTML文件中与目标对象相关的数据,更新第一页面和第二页面。 Specifically, the result determining module determines the drag operation result by reading the HTML file of the second page, extracting the position parameter of the new target object in the second page, and the like, wherein the drag operation result includes the network identifier of the target object. Then, the sending module sends the drag operation result to the web server for updating the first page and the second page; after the web server receives the drag operation result, the first page is determined according to the network identifier of the target object. The data related to the target object in the HTML file is written into the second page HTML file, and the data related to the target object in the HTML file of the first page is deleted, and the first page and the second page are updated.
在此处所提供的说明书中,说明了大量具体细节。然而,能够理解,本发明的实施例可以在没有这些具体细节的情况下实践。在一些实例中,并未详细示出公知的方法、结构和技术,以便不模糊对本说明书的理解。In the description provided herein, numerous specific details are set forth. However, it is understood that the embodiments of the invention may be practiced without these specific details. In some instances, well-known methods, structures, and techniques are not shown in detail so as not to obscure the understanding of the description.
类似地,应当理解,为了精简本公开并帮助理解各个发明方面中的一个或多个,在上面对本发明的示例性实施例的描述中,本发明的各个特征有时被一起分组到单个实施例、图、或者对其的描述中。然而,并不应将该公开的方法解释成反映如下意图:即所要求保护的本发明要求比在每个权利要求中所明确记载的特征更多的特征。更确切地说,如下面的权利要求书所反映的那样,发明方面在于少于前面公开的单个实施例的所有特征。因此,遵循具体实施方式的权利要求书由此明确地并入该具体实施方式,其中每个权利要求本身都作为本发明的单独实施例。Similarly, the various features of the invention are sometimes grouped together into a single embodiment, in the above description of the exemplary embodiments of the invention, Figure, or a description of it. However, the method disclosed is not to be interpreted as reflecting the intention that the claimed invention requires more features than those recited in the claims. Rather, as the following claims reflect, inventive aspects reside in less than all features of the single embodiments disclosed herein. Therefore, the claims following the specific embodiments are hereby explicitly incorporated into the embodiments, and each of the claims as a separate embodiment of the invention.
本领域那些技术人员可以理解,可以对实施例中的设备中的模块进行自适应性地改变并且把它们设置在与该实施例不同的一个或多个设备中。可以把实施例中的模块或单元或组件组合成一个模块或单元或组件,以及此外可以把它们分成多个子模块或子单元或子组件。除了这样的特征和/或过程或者单元中的至少一些是相互排斥之外,可以采用任何组合对本说明书(包括伴随的权利要求、摘要和附图)中公开的所有特征以及如此公开的任何方法或者设备的所有过程或单元进行组合。除非另外明确陈述,本说明书(包括伴随的权利要求、摘要和附图)中公开的每个特征可以由提供相同、等同或相似目的的替代特征来代替。Those skilled in the art will appreciate that the modules in the devices of the embodiments can be adaptively changed and placed in one or more devices different from the embodiment. The modules or units or components of the embodiments may be combined into one module or unit or component, and further they may be divided into a plurality of sub-modules or sub-units or sub-components. In addition to such features and/or at least some of the processes or units being mutually exclusive, any combination of the features disclosed in the specification, including the accompanying claims, the abstract and the drawings, and any methods so disclosed, or All processes or units of the device are combined. Each feature disclosed in this specification (including the accompanying claims, the abstract and the drawings) may be replaced by alternative features that provide the same, equivalent or similar purpose.
此外,本领域的技术人员能够理解,尽管在此所述的一些实施例包括其它实施例中所包括的某些特征而不是其它特征,但是不同实施例的特征的组合意味着处于本发明的范围之内并且形成不同的实施例。例如,在下面的权利要求书中,所要求保护的实施例的任意之一都可以以任意的组合方式来使用。In addition, those skilled in the art will appreciate that, although some embodiments described herein include certain features that are included in other embodiments and not in other features, combinations of features of different embodiments are intended to be within the scope of the present invention. Different embodiments are formed and formed. For example, in the following claims, any one of the claimed embodiments can be used in any combination.
本发明的各个部件实施例可以以硬件实现,或者以在一个或者多个处理器上运行的软件模块实现,或者以它们的组合实现。本领域的技术人员应当理解,可以在实践中使用微处理器或者数字信号处理器(DSP)来实现根据本发明实施例的基于拖拽操作跨页面调整对象位置的装置中的一些或者全部部件的一些或者全部功能。本发明还可以实现为用于执行这里所描述的方法的一部分或者全部的设备或者装置程序(例如,计算机程序和计算机程序产品)。这样的实现本发明的程序可以存储在计算机可读介质上,或者可以具有一个或者多个信号的形式。这样的信号可以从因特网网站上下载得到,或者在载体信号上提供,或者以任何其他形式提供。The various component embodiments of the present invention may be implemented in hardware, or in a software module running on one or more processors, or in a combination thereof. Those skilled in the art will appreciate that a microprocessor or digital signal processor (DSP) may be used in practice to implement some or all of the components of the apparatus for adjusting the position of an object across pages based on drag and drop operations in accordance with embodiments of the present invention. Some or all of the features. The invention can also be implemented as a device or device program (e.g., a computer program and a computer program product) for performing some or all of the methods described herein. Such a program implementing the invention may be stored on a computer readable medium or may be in the form of one or more signals. Such signals may be downloaded from an Internet website, provided on a carrier signal, or provided in any other form.
例如,图3示出了可以实现基于拖拽操作跨页面调整对象位置的方法的计算设备。该计算设备传统上包括处理器310和存储器320形式的计算机程序产品或者计算机可读 介质。存储器320可以是诸如闪存、EEPROM(电可擦除可编程只读存储器)、EPROM、硬盘或者ROM之类的电子存储器。存储器320具有存储用于执行上述方法中的任何方法步骤的程序代码331的存储空间330。例如,存储程序代码的存储空间330可以包括分别用于实现上面的方法中的各种步骤的各个程序代码331。这些程序代码可以从一个或者多个计算机程序产品中读出或者写入到这一个或者多个计算机程序产品中。这些计算机程序产品包括诸如硬盘,紧致盘(CD)、存储卡或者软盘之类的程序代码载体。这样的计算机程序产品通常为例如图4所示的便携式或者固定存储单元。该存储单元可以具有与图3的计算设备中的存储器320类似布置的存储段、存储空间等。程序代码可以例如以适当形式进行压缩。通常,存储单元包括用于执行本发明的方法步骤的计算机可读代码331’,即可以由诸如310之类的处理器读取的代码,当这些代码由计算设备运行时,导致该计算设备执行上面所描述的方法中的各个步骤。For example, FIG. 3 illustrates a computing device that can implement a method of adjusting an object location across pages based on a drag operation. The computing device conventionally includes a computer program product in the form of a processor 310 and a memory 320 or computer readable medium. The memory 320 may be an electronic memory such as a flash memory, an EEPROM (Electrically Erasable Programmable Read Only Memory), an EPROM, a hard disk, or a ROM. The memory 320 has a storage space 330 that stores program code 331 for performing any of the method steps described above. For example, storage space 330 storing program code may include various program code 331 for implementing various steps in the above methods, respectively. The program code can be read from or written to one or more computer program products. These computer program products include program code carriers such as hard disks, compact disks (CDs), memory cards or floppy disks. Such computer program products are typically portable or fixed storage units such as those shown in FIG. The storage unit may have storage segments, storage spaces, and the like that are similarly arranged to memory 320 in the computing device of FIG. The program code can be compressed, for example, in an appropriate form. Typically, the storage unit includes computer readable code 331' for performing the method steps of the present invention, ie, code that can be read by a processor, such as 310, that when executed by the computing device causes the computing device to execute Each of the steps in the method described above.
本文中所称的“一个实施例”、“实施例”或者“一个或者多个实施例”意味着,结合实施例描述的特定特征、结构或者特性包括在本发明的至少一个实施例中。此外,请注意,这里“在一个实施例中”的词语例子不一定全指同一个实施例。"an embodiment," or "an embodiment," or "an embodiment," In addition, it is noted that the phrase "in one embodiment" is not necessarily referring to the same embodiment.
应该注意的是上述实施例对本发明进行说明而不是对本发明进行限制,并且本领域技术人员在不脱离所附权利要求的范围的情况下可设计出替换实施例。在权利要求中,不应将位于括号之间的任何参考符号构造成对权利要求的限制。单词“包含”不排除存在未列在权利要求中的元件或步骤。位于元件之前的单词“一”或“一个”不排除存在多个这样的元件。本发明可以借助于包括有若干不同元件的硬件以及借助于适当编程的计算机来实现。在列举了若干装置的单元权利要求中,这些装置中的若干个可以是通过同一个硬件项来具体体现。单词第一、第二、以及第三等的使用不表示任何顺序。可将这些单词解释为名称。It is to be noted that the above-described embodiments are illustrative of the invention and are not intended to be limiting, and that the invention may be devised without departing from the scope of the appended claims. In the claims, any reference signs placed between parentheses shall not be construed as a limitation. The word "comprising" does not exclude the presence of the elements or steps that are not recited in the claims. The word "a" or "an" The invention can be implemented by means of hardware comprising several distinct elements and by means of a suitably programmed computer. In the unit claims enumerating several means, several of these means can be embodied by the same hardware item. The use of the words first, second, and third does not indicate any order. These words can be interpreted as names.
此外,还应当注意,本说明书中使用的语言主要是为了可读性和教导的目的而选择的,而不是为了解释或者限定本发明的主题而选择的。因此,在不偏离所附权利要求书的范围和精神的情况下,对于本技术领域的普通技术人员来说许多修改和变更都是显而易见的。对于本发明的范围,对本发明所做的公开是说明性的,而非限制性的,本发明的范围由所附权利要求书限定。 In addition, it should be noted that the language used in the specification has been selected for the purpose of readability and teaching, and is not intended to be construed or limited. Therefore, many modifications and changes will be apparent to those skilled in the art without departing from the scope of the invention. The disclosure of the present invention is intended to be illustrative, and not restrictive, and the scope of the invention is defined by the appended claims.

Claims (16)

  1. 一种基于拖拽操作跨页面调整对象位置的方法,包括:A method for adjusting the position of an object across pages according to a drag and drop operation, including:
    检测到将第一页面中的目标对象拖拽至第二页面的拖拽操作时,确定与拖拽相关的目标对象相关信息;When the drag operation of dragging the target object in the first page to the second page is detected, determining related information of the target object related to the dragging;
    基于预定的页面间通信方式,将所述目标对象相关信息从所述第一页面传递至所述第二页面;以及Transmitting the target object related information from the first page to the second page based on a predetermined inter-page communication manner;
    根据所述目标对象相关信息,在所述第二页面中创建并显示新目标对象,同时隐藏所述第一页面中的目标对象。And creating and displaying a new target object in the second page while hiding the target object in the first page according to the target object related information.
  2. 根据权利要求1所述的基于拖拽操作跨页面调整对象位置的方法,其中,所述拖拽操作的具体检测方式包括:The method for adjusting an object position across pages according to the drag operation according to claim 1, wherein the specific detection manner of the drag operation comprises:
    检测到拖拽距离大于预设的距离时,确定用户进行拖拽操作;和/或Determining that the user performs a drag operation when detecting that the drag distance is greater than a preset distance; and/or
    检测到拖拽时间大于预设的时间时,确定用户进行拖拽操作。When it is detected that the drag time is greater than the preset time, it is determined that the user performs the drag operation.
  3. 根据权利要求1或2所述的基于拖拽操作跨页面调整对象位置的方法,其中,所述与拖拽相关的目标对象相关信息,包括以下至少任一项内容:The method for adjusting an object position across pages according to the drag operation according to claim 1 or 2, wherein the target object related information related to the drag includes at least one of the following contents:
    目标对象的内容数据;Content data of the target object;
    目标对象的显示效果参数;The display effect parameter of the target object;
    目标对象的网络标识。The network ID of the target object.
  4. 根据权利要求1-3任一项所述的基于拖拽操作跨页面调整对象位置的方法,其中,所述第一页面及所述第二页面是基于HTML iframe的属于同一主页面的子页面;The method for adjusting an object position across pages according to any one of claims 1-3, wherein the first page and the second page are sub-pages belonging to the same main page based on an HTML iframe;
    所述基于预定的页面间通信方式,将所述目标对象相关信息从所述第一页面传递至所述第二页面的步骤进一步包括:The step of transmitting the target object related information from the first page to the second page based on a predetermined inter-page communication manner further includes:
    基于HTML iframe页面通信机制,将所述目标对象相关信息通过所述主页面从所述第一页面传递至所述第二页面。And transmitting the target object related information from the first page to the second page through the main page based on an HTML iframe page communication mechanism.
  5. 根据权利要求1-4任一项所述的基于拖拽操作跨页面调整对象位置的方法,其中,所述基于预定的页面间通信方式,将所述目标对象相关信息从所述第一页面传递至所述第二页面的步骤进一步包括:The method for adjusting an object position across pages according to a drag operation according to any one of claims 1 to 4, wherein the target object related information is transmitted from the first page based on a predetermined inter-page communication manner The step to the second page further includes:
    依据所述第二页面确定本地存储的第二页面相关的目录;以及Determining, according to the second page, a locally stored second page related directory;
    利用所述第一页面中的、所述第二页面的iframe标签元素接收所述目标对象相关信息,并将所述目标对象相关信息存储在所述第二页面相关的目录,以供所述第二页面使用。Receiving, by using an iframe tag element of the second page in the first page, the target object related information, and storing the target object related information in a directory related to the second page, for the first Two pages are used.
  6. 根据权利要求1-5任一项所述的基于拖拽操作跨页面调整对象位置的方法,其 中,所述第一页面及所述第二页面是独立的两个页面;A method for adjusting an object position across pages according to a drag operation according to any one of claims 1 to 5, The first page and the second page are two separate pages;
    所述基于预定的页面间通信方式,将所述目标对象相关信息从所述第一页面传递至所述第二页面的步骤进一步包括:The step of transmitting the target object related information from the first page to the second page based on a predetermined inter-page communication manner further includes:
    将所述拖拽相关信息通过网页服务器从所述第一页面传递至所述第二页面。The drag related information is transmitted from the first page to the second page through a web server.
  7. 根据权利要求1-6任一项所述的基于拖拽操作跨页面调整对象位置的方法,其中,还包括:The method for adjusting an object position across pages according to a drag operation according to any one of claims 1-6, further comprising:
    确定拖拽操作结果,其中,所述拖拽操作结果包括所述目标对象的网络标识;以及Determining a drag operation result, wherein the drag operation result includes a network identifier of the target object;
    将所述拖拽操作结果发送至网页服务器,以用于更新所述第一页面和所述第二页面。Sending the drag operation result to a web server for updating the first page and the second page.
  8. 一种基于拖拽操作跨页面调整对象位置的装置,其中,包括:A device for adjusting an object position across pages according to a drag operation, including:
    对象信息确定模块,用于检测到将第一页面中的目标对象拖拽至第二页面的拖拽操作时,确定与拖拽相关的目标对象相关信息;An object information determining module, configured to determine target object related information related to the dragging when the drag operation of dragging the target object in the first page to the second page is detected;
    传递模块,用于基于预定的页面间通信方式,将所述目标对象相关信息从所述第一页面传递至所述第二页面;以及a delivery module, configured to transfer the target object related information from the first page to the second page based on a predetermined inter-page communication manner;
    显示模块,用于根据所述目标对象相关信息,在所述第二页面中创建并显示新目标对象,同时隐藏所述第一页面中的目标对象。And a display module, configured to create and display a new target object in the second page according to the target object related information, while hiding the target object in the first page.
  9. 根据权利要求8所述的基于拖拽操作跨页面调整对象位置的装置,其中,所述对象信息确定模块检测所述拖拽操作的具体方式包括:The apparatus for adjusting an object position across pages according to the drag operation according to claim 8, wherein the specific manner in which the object information determining module detects the drag operation comprises:
    检测到拖拽距离大于预设的距离时,确定用户进行拖拽操作;和/或Determining that the user performs a drag operation when detecting that the drag distance is greater than a preset distance; and/or
    检测到拖拽时间大于预设的时间时,确定用户进行拖拽操作。When it is detected that the drag time is greater than the preset time, it is determined that the user performs the drag operation.
  10. 根据权利要求8或9所述的基于拖拽操作跨页面调整对象位置的装置,其中,所述与拖拽相关的目标对象相关信息,包括以下至少任一项内容:The apparatus for adjusting an object position across pages according to the drag operation according to claim 8 or 9, wherein the target object related information related to the drag includes at least one of the following contents:
    目标对象的内容数据;Content data of the target object;
    目标对象的显示效果参数;The display effect parameter of the target object;
    目标对象的网络标识。The network ID of the target object.
  11. 根据权利要求8-10所述的基于拖拽操作跨页面调整对象位置的装置,其中,所述第一页面及所述第二页面是基于HTML iframe的属于同一主页面的子页面;The apparatus for adjusting an object position across pages according to the drag operation according to any one of claims 8-10, wherein the first page and the second page are sub-pages belonging to the same main page based on an HTML iframe;
    所述传递模块用于基于HTML iframe页面通信机制,将所述目标对象相关信息通过所述主页面从所述第一页面传递至所述第二页面。The delivery module is configured to pass the target object related information from the first page to the second page through the main page based on an HTML iframe page communication mechanism.
  12. 根据权利要求8-10所述的基于拖拽操作跨页面调整对象位置的装置,其中,所述传递模块进一步包括:The apparatus for adjusting an object position across pages according to a drag operation according to any of claims 8-10, wherein the delivery module further comprises:
    目录查找单元,用于依据所述第二页面确定本地存储的第二页面相关的目录;以及 a directory searching unit, configured to determine, according to the second page, a locally stored second page related directory;
    信息存储单元,用于利用所述第一页面中的、所述第二页面的iframe标签元素接收所述目标对象相关信息,并将所述目标对象相关信息存储在所述第二页面相关的目录,以供所述第二页面使用。An information storage unit, configured to receive the target object related information by using an iframe tag element of the second page in the first page, and store the target object related information in a directory related to the second page For use on the second page.
  13. 根据权利要求8-12任一项所述的基于拖拽操作跨页面调整对象位置的装置,其中,所述第一页面及所述第二页面是独立的两个页面;The apparatus for adjusting an object position across pages according to a drag operation according to any one of claims 8 to 12, wherein the first page and the second page are two independent pages;
    所述传递模块进一步用于将所述拖拽相关信息通过网页服务器从所述第一页面传递至所述第二页面。The delivery module is further configured to pass the drag related information from the first page to the second page through a web server.
  14. 根据权利要求8-13任一项所述的基于拖拽操作跨页面调整对象位置的装置,其中,所述装置进一步包括:The apparatus for adjusting an object position across a page based on a drag operation according to any one of claims 8 to 13, wherein the apparatus further comprises:
    结果确定模块,用于确定拖拽操作结果,其中,所述拖拽操作结果包括所述目标对象的网络标识;a result determining module, configured to determine a drag operation result, wherein the drag operation result includes a network identifier of the target object;
    发送模块,用于将所述拖拽操作结果发送至网页服务器,以用于更新所述第一页面和所述第二页面。And a sending module, configured to send the drag operation result to a webpage server, for updating the first page and the second page.
  15. 一种计算机程序,包括计算机可读代码,当所述计算机可读代码在计算设备上运行时,导致所述计算设备执行根据权利要求1至7任一项所述的基于拖拽操作跨页面调整对象位置的方法。A computer program comprising computer readable code causing the computing device to perform a cross-page adjustment based on a drag operation according to any one of claims 1 to 7 when the computer readable code is run on a computing device The method of the object location.
  16. 一种计算机可读介质,其中存储了如权利要求15所述的计算机程序。 A computer readable medium storing the computer program of claim 15.
PCT/CN2015/095469 2014-12-26 2015-11-24 Drag-and-drop operation-based method and device for adjusting location of object in cross pages WO2016101755A1 (en)

Applications Claiming Priority (2)

Application Number Priority Date Filing Date Title
CN201410835124.1 2014-12-26
CN201410835124.1A CN104461309A (en) 2014-12-26 2014-12-26 Method and device for cross-page object position adjustment based on dragging operation

Publications (1)

Publication Number Publication Date
WO2016101755A1 true WO2016101755A1 (en) 2016-06-30

Family

ID=52907452

Family Applications (1)

Application Number Title Priority Date Filing Date
PCT/CN2015/095469 WO2016101755A1 (en) 2014-12-26 2015-11-24 Drag-and-drop operation-based method and device for adjusting location of object in cross pages

Country Status (2)

Country Link
CN (1) CN104461309A (en)
WO (1) WO2016101755A1 (en)

Cited By (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN109885819A (en) * 2019-02-19 2019-06-14 携程旅游信息技术(上海)有限公司 Data form dynamic adjusting method, system, equipment and storage medium
CN113325977A (en) * 2021-05-27 2021-08-31 天津安捷物联科技股份有限公司 Dynamic configuration and map display method for energy equipment relationship
CN114153367A (en) * 2022-02-10 2022-03-08 中国电子信息产业集团有限公司 Interactive method and equipment for quickly replacing connection relation and readable storage medium
CN116522876A (en) * 2023-05-08 2023-08-01 北京中宏立达科技发展有限公司 Method and device for realizing PDF text labeling of webpages of fire fox browser

Families Citing this family (10)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN104461309A (en) * 2014-12-26 2015-03-25 北京奇虎科技有限公司 Method and device for cross-page object position adjustment based on dragging operation
CN104932889B (en) * 2015-06-15 2018-10-09 北京奇虎科技有限公司 Page visualized generation method and device
CN106648282B (en) * 2015-10-30 2021-05-14 北京国双科技有限公司 Method and device for processing indexes in webpage
CN106886521A (en) * 2015-12-15 2017-06-23 阿里巴巴集团控股有限公司 Across the operating method and device of page object
CN106951523B (en) * 2017-03-20 2019-12-10 北京搜狐新媒体信息技术有限公司 object processing method and system
CN109343776A (en) * 2018-08-21 2019-02-15 北京奇艺世纪科技有限公司 A kind of customized page generation method, device and terminal device
CN111459580B (en) * 2019-01-22 2023-06-20 阿里巴巴集团控股有限公司 Page display method and device
WO2020238022A1 (en) 2019-05-28 2020-12-03 贝壳找房(北京)科技有限公司 Three-dimensional space view display method, apparatus, and storage medium
CN112085852B (en) * 2019-05-28 2021-11-09 贝壳找房(北京)科技有限公司 Method, device and system for displaying three-dimensional models of house before and after decoration on same screen
CN111949186B (en) * 2020-07-20 2022-02-15 上海淇馥信息技术有限公司 Method and device for assisting in finding target object in cluster and electronic equipment

Citations (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102662600A (en) * 2012-04-28 2012-09-12 北京亿中邮信息技术有限公司 Method for mutually dragging files at different domain names
CN103500053A (en) * 2013-09-04 2014-01-08 上海软智信息科技有限公司 Method and device for cross-domain data interaction
CN104461309A (en) * 2014-12-26 2015-03-25 北京奇虎科技有限公司 Method and device for cross-page object position adjustment based on dragging operation

Family Cites Families (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US8504931B2 (en) * 2008-12-19 2013-08-06 Yahoo! Inc. Conversion service for data dragged on web-sites
CN101593207A (en) * 2009-07-06 2009-12-02 孟智平 The method and system of a kind of structure and generation webpage
CN101710268A (en) * 2009-12-17 2010-05-19 深圳华为通信技术有限公司 Method and device for adjusting page layout

Patent Citations (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102662600A (en) * 2012-04-28 2012-09-12 北京亿中邮信息技术有限公司 Method for mutually dragging files at different domain names
CN103500053A (en) * 2013-09-04 2014-01-08 上海软智信息科技有限公司 Method and device for cross-domain data interaction
CN104461309A (en) * 2014-12-26 2015-03-25 北京奇虎科技有限公司 Method and device for cross-page object position adjustment based on dragging operation

Cited By (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN109885819A (en) * 2019-02-19 2019-06-14 携程旅游信息技术(上海)有限公司 Data form dynamic adjusting method, system, equipment and storage medium
CN109885819B (en) * 2019-02-19 2022-12-20 携程旅游信息技术(上海)有限公司 Data table dynamic adjustment method, system, device and storage medium
CN113325977A (en) * 2021-05-27 2021-08-31 天津安捷物联科技股份有限公司 Dynamic configuration and map display method for energy equipment relationship
CN114153367A (en) * 2022-02-10 2022-03-08 中国电子信息产业集团有限公司 Interactive method and equipment for quickly replacing connection relation and readable storage medium
CN116522876A (en) * 2023-05-08 2023-08-01 北京中宏立达科技发展有限公司 Method and device for realizing PDF text labeling of webpages of fire fox browser
CN116522876B (en) * 2023-05-08 2024-01-09 北京中宏立达科技发展有限公司 Method and device for realizing PDF text labeling of webpages of fire fox browser

Also Published As

Publication number Publication date
CN104461309A (en) 2015-03-25

Similar Documents

Publication Publication Date Title
WO2016101755A1 (en) Drag-and-drop operation-based method and device for adjusting location of object in cross pages
US11113448B2 (en) Presenting views of an electronic document
US10042519B2 (en) Creation and exposure of embedded secondary content data relevant to a primary content page of an electronic book
AU2012370492B2 (en) Graphical overlay related to data mining and analytics
US9311283B2 (en) System for clipping webpages by traversing a dom, and highlighting a minimum number of words
US20140380142A1 (en) Capturing website content through capture services
US9436772B2 (en) Appending a uniform resource identifier (URI) fragment identifier to a uniform resource locator (URL)
KR102369604B1 (en) Presenting fixed format documents in reflowed format
US10346523B1 (en) Content synchronization across devices
EP4036762A1 (en) Speeding up document loading
US20130042171A1 (en) Method and system for generating and managing annotation in electronic book
WO2016101754A1 (en) Method and device for web page switching, and device for providing integrated page
US9679081B2 (en) Navigation control for network clients
US20170192941A1 (en) Computer-Automated Generation of Application Deep Links
US10572106B2 (en) Method and apparatus for performing URL linkage function using the keypad
US10339195B2 (en) Navigation control for network clients
CN107077473A (en) System, method and computer-readable medium for display content
US9483574B2 (en) Managing distinct content lists using user interface element and without using modal dialog box
US20130311359A1 (en) Triple-click activation of a monetizing action
CN105512123A (en) Methods and devices for establishing webpage feature image and generating webpage bookmark
US9916292B2 (en) Method of identifying a target object on a web page
CN105224571A (en) Terminal uploaded data processing method and device and data uploading processing method and device
US10114805B1 (en) Inline address commands for content customization
WO2016138394A1 (en) Methods and systems for cross-device webpage replication
JP6217473B2 (en) Web service providing device

Legal Events

Date Code Title Description
121 Ep: the epo has been informed by wipo that ep was designated in this application

Ref document number: 15871824

Country of ref document: EP

Kind code of ref document: A1

NENP Non-entry into the national phase

Ref country code: DE

122 Ep: pct application non-entry in european phase

Ref document number: 15871824

Country of ref document: EP

Kind code of ref document: A1