Page control method and page control device
By passing the identity of the target page into the preconfigured return component and binding the scroll event, the subpage is quickly returned to the preset position, solving the problem of being unable to flexibly control local layout back to the top in the existing technology, and improving the Development efficiency and business usage scenarios.
Patent Information
- Application Number
- CN202010900340.5
- Authority / Receiving Office
- CN · China
- Patent Type
- Patents(China)
- Current Assignee / Owner
- Filing Date
- 2020-08-31
- Publication Date
- 2024-12-10
- Estimated Expiration
- 2040-08-31
AI Technical Summary
The prior art cannot flexibly control the local layout of page documents to return to the top in the local space, and cannot achieve the quick return of subpages to the desired location.
By passing the identity of the target page into the preconfigured return component, binding the scroll event, monitoring the scroll distance. When the distance is greater than the preset threshold, the return component is used to control the target page to return to the preset position, and supports custom configuration return component properties and click return method.
It realizes the quick return of subpages to the preset position, avoids a lot of code writing, improves user development efficiency, and enhances business usage scenarios, such as supporting many comment content in floating windows and the need to scroll in local layout.
Smart Images

Figure CN113760273B_ABST
Abstract
Description
Technical Field
[0001] The present invention relates to the field of computer technology, and in particular to a page control method and a page control device. Background Art
[0002] The existing front-end component library can realize the function of returning the page to the top. Specifically, the scrolltop property of document.body (ie, the page document) is used to control the position of the current document relative to the user's visual display, and then animation is added to make it return to the top slowly or quickly.
[0003] However, in the process of implementing the present invention, the inventors found that there are at least the following problems in the prior art: the prior art can only control the scrolling of the entire page document to the top, and cannot flexibly control the local layout of the page document to return to the top in the local space. Summary of the invention
[0004] In view of this, an embodiment of the present invention provides a page control method and a page control device, which can satisfy the user's need to arbitrarily select a sub-page to quickly return to the desired location, avoid a large amount of code writing, improve user development efficiency, and enhance business usage scenarios.
[0005] To achieve the above objective, according to a first aspect of an embodiment of the present invention, a page control method is provided.
[0006] A page control method according to an embodiment of the present invention comprises: determining a target page according to a received page control instruction, wherein the target page is a subpage contained in a main page; passing an identifier of the target page into a pre-configured return component, and binding a scrolling event to the target page; in the case where the target page scrolls, monitoring the scrolling of the target page using the scrolling event to obtain a scrolling distance of the target page; and in the case where the scrolling distance is greater than a preset distance threshold, controlling the target page to return to a preset position according to the pre-configured return component.
[0007] Optionally, before passing the identifier of the target page into the pre-configured return component, the method also includes: introducing a return to top component in the user interface design component library, rewriting the return to top component to customize the properties of the return to top component; and wrapping an external container around the rewritten return to top component to obtain the pre-configured return component.
[0008] Optionally, rewriting the return-to-top component includes: adding display attributes to the return-to-top component to put the return-to-top component in a display state; and setting size attributes and position attributes of the return-to-top component.
[0009] Optionally, the method further includes: controlling the display state of the external container through a display variable of the external container to control the display state of the return-to-top component; and binding a click-to-return method to the external container.
[0010] Optionally, when the scrolling distance is greater than a preset distance threshold, the target page is controlled to return to a preset position according to the preconfigured return component, including: when the scrolling distance is greater than the preset distance threshold, updating the display variable of the external container to true, so as to control the return to top component to be displayed on the target page; if an operation of clicking the return to top component is obtained, triggering the click return method, and controlling the target page to return to the preset position according to the return distance in the click return method.
[0011] Optionally, the preset position is indicated in the page control instruction, and the return distance is set according to the preset position; and the target page is controlled to return to the preset position according to the return distance in the click return method, including: if the preset position is the top, then according to the return distance, the page data of the target page is controlled to return to the top of the target page; if the preset position is a specific position, then according to the return distance, the page data of the target page is controlled to return to the specific position of the target page.
[0012] To achieve the above objective, according to a second aspect of an embodiment of the present invention, a page control device is provided.
[0013] A page control device according to an embodiment of the present invention comprises: a determination module, used to determine a target page according to a received page control instruction, wherein the target page is a subpage contained in a main page; an input module, used to input an identifier of the target page into a pre-configured return component, and bind a scrolling event to the target page; an acquisition module, used to monitor the scrolling of the target page by using the scrolling event when the target page scrolls, and obtain the scrolling distance of the target page; and a control module, used to control the target page to return to a preset position according to the pre-configured return component when the scrolling distance is greater than a preset distance threshold.
[0014] Optionally, the incoming module is also used to: introduce a return-to-top component in a user interface design component library, rewrite the return-to-top component to customize the properties of the return-to-top component; and wrap an external container around the rewritten return-to-top component to obtain the pre-configured return component.
[0015] Optionally, the input module is further used to: add display attributes to the return-to-top component to put the return-to-top component in a display state; and set size attributes and position attributes of the return-to-top component.
[0016] Optionally, the input module is further used to: control the display state of the external container through the display variable of the external container to control the display state of the return to top component; and bind a click-to-return method to the external container.
[0017] Optionally, the control module is also used to: when the scrolling distance is greater than the preset distance threshold, update the display variable of the external container to true, so as to control the return to top component to be displayed on the target page; if an operation of clicking the return to top component is obtained, trigger the click return method, and control the target page to return to the preset position according to the return distance in the click return method.
[0018] Optionally, the preset position is indicated in the page control instruction, and the return distance is set according to the preset position; and the control module is also used to: if the preset position is the top, then according to the return distance, control the page data of the target page to return to the top of the target page; if the preset position is a specific position, then according to the return distance, control the page data of the target page to return to the specific position of the target page.
[0019] To achieve the above objective, according to a third aspect of an embodiment of the present invention, an electronic device is provided.
[0020] An electronic device according to an embodiment of the present invention includes: one or more processors; a storage device for storing one or more programs, and when the one or more programs are executed by the one or more processors, the one or more processors implement the page control method according to the embodiment of the present invention.
[0021] To achieve the above objective, according to a fourth aspect of an embodiment of the present invention, a computer-readable medium is provided.
[0022] A computer-readable medium according to an embodiment of the present invention stores a computer program, and when the program is executed by a processor, the page control method according to the embodiment of the present invention is implemented.
[0023] An embodiment of the above invention has the following advantages or beneficial effects: a technical means is adopted to pass the identifier of the target page into a pre-configured return component to realize the quick return of the target page to a preset position, and the target page is a sub-page contained in the main page, thereby solving the technical problem in the prior art that the local layout of the page document cannot be flexibly controlled to return to the top in the local space, and satisfying the user's ability to freely select a sub-page to quickly return to the desired position according to their needs, avoiding a large amount of code writing, improving user development efficiency, and enhancing business usage scenarios, such as supporting multiple scenarios such as excessive comments in the floating window and the need to scroll the local layout.
[0024] The further effects of the above-mentioned non-conventional optional manner will be described below in conjunction with specific implementation examples. BRIEF DESCRIPTION OF THE DRAWINGS
[0025] The accompanying drawings are used to better understand the present invention and do not constitute an improper limitation of the present invention.
[0026] Figure 1 is a schematic diagram of main steps of a page control method according to an embodiment of the present invention;
[0027] Figure 2 It is a schematic diagram of the relationship between the main page and the sub-pages;
[0028] Figure 3 is a schematic diagram of the main steps of obtaining a pre-configured return component according to an embodiment of the present invention;
[0029] Figure 4 is a schematic diagram of a main process of controlling a target page to return to a preset position according to an embodiment of the present invention;
[0030] Figure 5 is a schematic diagram of main modules of a page control device according to an embodiment of the present invention;
[0031] Figure 6 is an exemplary system architecture diagram to which embodiments of the present invention may be applied;
[0032] Figure 7 It is a schematic diagram of the structure of a computer system of a terminal device or a server suitable for implementing an embodiment of the present invention. DETAILED DESCRIPTION
[0033] The following is a description of exemplary embodiments of the present invention in conjunction with the accompanying drawings, including various details of the embodiments of the present invention to facilitate understanding, which should be considered as merely exemplary. Therefore, it should be recognized by those of ordinary skill in the art that various changes and modifications may be made to the embodiments described herein without departing from the scope and spirit of the present invention. Similarly, for clarity and conciseness, the description of well-known functions and structures is omitted in the following description.
[0034] Figure 1 is a schematic diagram of the main steps of the page control method according to an embodiment of the present invention. Figure 1 As shown, the main steps of the page control method may include:
[0035] Step S101, determining a target page according to the received page control instruction, wherein the target page is a sub-page included in the main page;
[0036] Step S102, passing the target page identifier into a pre-configured return component, and binding a scroll event to the target page;
[0037] Step S103, when the target page is scrolling, the scrolling of the target page is monitored by using a scrolling event to obtain a scrolling distance of the target page;
[0038] Step S104: When the scrolling distance is greater than a preset distance threshold, the target page is controlled to return to a preset position according to a pre-configured return component.
[0039] The main page refers to the entire page document, and the subpage refers to the local layout in the page document. For ease of understanding, Figure 2 To explain, Figure 2 This is a schematic diagram of the relationship between the main page and the sub-pages. Figure 2 As shown, there is an interactive pop-up comment area A1 in page A, and the pop-up comment area A1 is a local layout in page A. Therefore, page A can be regarded as the main page, and the pop-up comment area A1 can be regarded as a sub-page contained in page A. Figure 2 In the example, since page A contains more content, and the display window of page A can only display part of the content, the content is displayed by scrolling the scroll axis of page A; similarly, pop-up comment area A1 contains more content, and the display window of pop-up comment area A1 can only display part of the content, and the content is displayed by scrolling the scroll axis of pop-up comment area A1.
[0040] The prior art can realize the quick return to the top of the main page. Specifically, after the user clicks the return to top icon in page A, the page data of page A can be returned to the top of the display window of page A, that is, the scroll axis of page A can be scrolled to the top of the display window of page A. However, the prior art cannot realize the quick return to the top of the sub-page, that is, the data of the pop-up comment area A1 cannot be returned to the top of the display window of the pop-up comment area A1 by clicking the return to top icon. Therefore, the prior art cannot flexibly control the local layout of the page document to return to the top in the local space.
[0041] In order to solve the problems existing in the prior art, an embodiment of the present invention provides a page control method shown in steps S101 to S104, which can control the target page to return to a preset position, that is, a desired position. First, determine the target page, that is, determine the sub-page that needs to have a quick return function. Since the prior art can realize the quick return of the main page to the top, the example of the present invention is analyzed for the target page as a sub-page. However, it should be noted that the page control method provided in the embodiment of the present invention can also realize the quick return of the main page to the preset position. In the subsequent description, it will be explained how to use the page control method provided in the embodiment of the present application to realize the quick return of the main page to the top to the preset position.
[0042] After determining the target page, the identifier of the target page can be passed into the pre-configured return component. Among them, the pre-configured return component is obtained by processing the existing return to top component. If a sub-page needs to have the function of quick return, then in the initialization hook function, the identifier of the sub-page can be passed as a parameter to the pre-configured return component, so that the component can find the sub-page through this identifier, and then the sub-page can use the pre-configured return component to quickly return to the preset position of the sub-page. In other words, if the identifier of a sub-page is passed as a parameter to the pre-configured return component, the sub-page can have a return icon, and when the return icon is clicked, the sub-page can return to the preset position of the sub-page.
[0043] By default, the identifier of any sub-page is not passed into the pre-configured return component. In this case, it is compatible with the existing return to top method and is considered to be bound to the main page, so that the main page can quickly return to the top. For example, the main page A includes sub-pages A1, A2, and A3. By default, the main page can quickly return to the top. If the identifier of sub-page A1 is passed into the pre-configured return component in the initialization hook function, A1 can quickly return to the preset position. Of course, if the identifier of the main page is passed into the pre-configured return component, the page control method provided in the embodiment of the present invention can quickly return the main page to the preset position.
[0044] In addition, when the identifier of the target page is passed into the pre-configured return component, it is also necessary to bind a scroll event, i.e., a scroll event, to the target page. The scroll event mainly records the scroll distance of the target page. Specifically, when the user slides the target page up and down with a mouse or finger, the scroll event bound to the target page will be triggered, and then the scroll event can record the scroll distance of the target page. If the scroll distance of the target page is greater than a preset distance threshold, the target page can be controlled to return to a preset position through a pre-configured return component. In an embodiment of the present invention, the preset distance threshold is set according to the display window height of the target page. For example, the preset distance threshold corresponding to the target page can be set to be the same as the display window height of the target page. Then, when the target page scrolls a display window height, the target page can be controlled to return to a preset position through a pre-configured return component.
[0045] According to the page control technical solution of the embodiment of the present invention, it is possible to adopt the technical means of passing the identifier of the target page into a pre-configured return component to realize the quick return of the target page to a preset position, and the target page is a sub-page contained in the main page. Therefore, the technical problem that the local layout of the page document cannot be flexibly controlled to return to the top in the local space in the prior art is solved, and the user can freely choose the sub-page to quickly return to the desired position according to their needs, avoiding a lot of code writing, improving user development efficiency, and enhancing business usage scenarios, such as supporting various scenarios such as too much comment content in the floating window and the need to scroll the local layout.
[0046] In the page control method provided by the embodiment of the present invention, the pre-configured return component is an important component. By passing the identifier of the target page into the pre-configured return component, the target page can be controlled to return to the preset position through the pre-configured return component. The process of obtaining the pre-configured return component is described in detail below.
[0047] Figure 3 FIG. 1 is a schematic diagram of the main steps of obtaining a pre-configured return component according to an embodiment of the present invention. Figure 3 As shown, the main steps to obtain a pre-configured return component may include:
[0048] Step S301, introducing a return-to-top component into a user interface design component library, and rewriting the return-to-top component to customize the properties of the return-to-top component;
[0049] Step S302, wrapping an external container around the rewritten return top component to obtain a pre-configured return component.
[0050] Among them, the user interface design component library refers to a component library used for user interface design, which can provide rich components and functions to meet most website scenarios, such as the iview component library; the back-to-top component, that is, the BackTop component, is used when the page content is lengthy and needs to be quickly returned to the top. The back-to-top component can be seen as a back-to-top icon that can be displayed on the page. Generally, when the page is scrolled to a certain height, the back-to-top component can be displayed and can be placed in the lower right corner of the page, such as Figure 1 Click the Back to Top icon in the lower right corner of page A as shown.
[0051] In step S301, it is necessary to first introduce a back-to-top component and then rewrite the style of the back-to-top component. In a reference embodiment of the present invention, rewriting the back-to-top component may include: adding display attributes to the back-to-top component, and setting size attributes and position attributes of the back-to-top component.
[0052] Among them, adding display properties to the back-to-top component can make the back-to-top component always displayed, and can also make the back-to-top component lose its original function of clicking the component to return to the top. Assume that Figure 1 If you add display properties to the corresponding Back to Top component, the Back to Top icon in the lower right corner of Page A will always be displayed, and after the user clicks the Back to Top icon, the scroll axis of Page A cannot scroll to the top of the display window of Page A. The size property refers to the display size of the Back to Top component, and the position property refers to the display position of the Back to Top component on the page. Since the display size and display position have been set in the Back to Top component, it can be used directly or set according to the user's own needs.
[0053] In step S302, an external container is wrapped around the rewritten return-to-top component, so that the return-to-top component can be indirectly controlled by the external container. As a reference embodiment of the present invention, the display state of the external container can be controlled by the display variable of the external container to control the display state of the return-to-top component; wherein the display state includes: display and hide. Since the return-to-top component is inside the external container, and the return-to-top component is always displayed by adding display properties to the return-to-top component, if the external container is displayed, the return-to-top component wrapped inside can be displayed, and if the external container is hidden, the return-to-top component wrapped inside can be hidden. Specifically, it can be controlled by the display variable showIcon of the external container (i.e., the attribute variable used to control whether the external container is displayed). If showIcon is true (true), it means that the external container is displayed and the return-to-top component will be displayed. If showIcon is false (false), it means that the external container is hidden and the return-to-top component will be hidden.
[0054] Since adding display properties to the Back to Top component may also cause the Back to Top component to lose its original function of returning to the top by clicking the component. Therefore, after wrapping the rewritten Back to Top component with an external container, a Click Return method can be bound to the external container. If the Click Return method is triggered, the page can be controlled to return to the preset position, or the Click Return method can control the relationship between the page data of the page and the display window of the page.
[0055] The prior art can only control the scrolling of the entire page document to the top, but cannot flexibly control the local layout of the page document to return to the top in the local space, that is, the prior art can only realize the quick return of the main page to the top, but cannot realize the quick return of the sub-page to the top. However, in the embodiment of the present invention, the identifier of the target page is passed into the pre-configured return component, and the scroll event is bound to the target page. When the user slides the target page up and down with the mouse or finger, the scroll event bound to the target page will be triggered. The scrolling of the target page can be monitored by using the scroll event to obtain the scrolling distance of the target page. Then, when the scrolling distance reaches a certain distance value, the pre-configured return component can be used to control the target page to quickly return to the preset position.
[0056] In a reference embodiment of the present invention, when the scrolling distance is greater than a preset distance threshold, according to a pre-configured return component, controlling the target page to return to a preset position may include: when the scrolling distance is greater than the preset distance threshold, updating the display variable of the external container to true, so as to control the return to top component to be displayed on the target page; if an operation of clicking to return to the top component is obtained, triggering a click return method, and controlling the target page to return to the preset position according to the return distance in the click return method.
[0057] As explained above, the pre-configured return component is obtained by rewriting the existing return to top component, and then wrapping an external container around the rewritten return to top component. The display variable of the external container can be used to control the display or hiding of the external container, and indirectly control the display or hiding of the return to top component. When the scroll distance of the target page is greater than the preset distance threshold, the value of the display variable showIcon of the external container will become true (true), and then the external container wrapping the return to top component will be displayed, and then the return to top icon corresponding to the return to top component will be displayed on the target page. When the scroll distance of the target page is less than or equal to the preset distance threshold, the value of the display variable showIcon of the external container will become false (false), and then the external container wrapping the return to top component will be hidden, and then the return to top icon corresponding to the return to top component will be hidden, that is, it will not be displayed on the target page. When the return to top icon is displayed on the target page, if the user clicks the icon, the user's click operation can be obtained, and then the target page is controlled to quickly return to the preset position, that is, the page data of the target page can be returned to the preset position of the target page.
[0058] In a reference embodiment of the present invention, in the process of obtaining a pre-configured return component, a click return method is bound to an external container that wraps the return to top component, so that when a user clicks, the click return method can be triggered, and then the page data of the target page is controlled to return to the preset position of the target page according to the return distance in the return method. The page control instruction can be an instruction sent by the user, and the preset position is indicated in the instruction, that is, the user's desired return position, such as the top and a specific position, can be determined through the instruction.
[0059] If the preset position is the top, then the return distance is set to be the same as the scroll distance. It should be noted that the scroll distance in the embodiment of the present invention is the distance that the target page scrolls in the initial state. Of course, the return distance can also be set according to the distance between the page data of the target page (i.e., the top of the data) and the bottom of the display window of the target page. When the distance between the page data of the target page and the bottom of the display window of the target page is the same as the height of the display window, it can be considered that the target page returns to the top.
[0060] In addition, if the preset position is a specific position, the distance between the specific position and the bottom of the display window of the target page is obtained, and then the return distance is set according to the obtained distance. In this way, after the click return method is triggered, the target page can be controlled to return to the specific position according to the set return distance.
[0061] Figure 4 FIG. 1 is a schematic diagram of the main process of controlling the target page to return to the preset position according to an embodiment of the present invention. Figure 4 As shown, the main process of controlling the target page to return to the preset position may include:
[0062] Step S401, triggering a scrolling event when the target page is scrolled;
[0063] Step S402, monitoring the scrolling of the target page through a scrolling event to obtain the scrolling distance of the target page;
[0064] Step S403, when the scrolling distance is greater than a preset distance threshold, updating the display variable of the external container to be true, so as to control the display of the return to top component on the target page;
[0065] Step S404: If the click-to-return-to-top component operation is obtained, the click-to-return method is triggered;
[0066] Step S405 , according to the return distance in the click return method, the page data of the target page is controlled to return to a preset position.
[0067] The page control method of the embodiment of the present invention can obtain a pre-configured return component through steps S301 to S302. When a sub-page needs to have a quick return function, the identifier of the sub-page can be passed into the obtained pre-configured return component, so that the sub-page can use the method introduced in steps S401 to S405 to quickly return to the preset position.
[0068] According to the page control technical solution of the embodiment of the present invention, it is possible to adopt the technical means of passing the identifier of the target page into a pre-configured return component to realize the quick return of the target page to a preset position, and the target page is a sub-page contained in the main page. Therefore, the technical problem that the local layout of the page document cannot be flexibly controlled to return to the top in the local space in the prior art is solved, and the user can freely choose the sub-page to quickly return to the desired position according to their needs, avoiding a lot of code writing, improving user development efficiency, and enhancing business usage scenarios, such as supporting various scenarios such as too much comment content in the floating window and the need to scroll the local layout.
[0069] Figure 5 Schematic diagram of the main modules of the page control device according to an embodiment of the present invention. Figure 5 As shown, the main modules of the page control device 500 may include: a determination module 501 , an input module 502 , an acquisition module 503 and a control module 504 .
[0070] Among them, the determination module 501 can be used to: determine the target page according to the received page control instruction, wherein the target page is a subpage contained in the main page; the input module 502 can be used to: input the identifier of the target page into the pre-configured return component, and bind the scroll event to the target page; the acquisition module 503 can be used to: when the target page scrolls, use the scroll event to monitor the scrolling of the target page and obtain the scrolling distance of the target page; the control module 504 can be used to: when the scrolling distance is greater than the preset distance threshold, according to the pre-configured return component, control the target page to return to the preset position. And the preset distance threshold is set according to the display window height of the target page.
[0071] In an embodiment of the present invention, the input module 502 can also be used to: introduce a return-to-top component into the user interface design component library, rewrite the return-to-top component to customize the properties of the return-to-top component; and wrap an external container around the rewritten return-to-top component to obtain a pre-configured return component.
[0072] In the embodiment of the present invention, the input module 502 can also be used to: add display attributes to the return-to-top component to put the return-to-top component in a display state; and set the size attribute and position attribute of the return-to-top component.
[0073] In the embodiment of the present invention, the input module 502 can also be used to: control the display state of the external container through the display variable of the external container to control the display state of the return to top component; and bind a click return method to the external container.
[0074] In an embodiment of the present invention, the control module 504 can also be used to: when the scrolling distance is greater than a preset distance threshold, update the display variable of the external container to true, so as to control the return to top component to be displayed on the target page; if the operation of clicking to return to the top component is obtained, trigger the click return method, and control the target page to return to the preset position according to the return distance in the click return method.
[0075] In the embodiment of the present invention, the page control instruction indicates a preset position, and the return distance is set according to the preset position. Furthermore, the control module 504 can also be used to: if the preset position is the top, control the page data of the target page to return to the top of the target page according to the return distance; if the preset position is a specific position, control the page data of the target page to return to the specific position of the target page according to the return distance.
[0076] According to the page control device of the embodiment of the present invention, it is able to use the technical means of passing the identifier of the target page into a pre-configured return component to realize the quick return of the target page to a preset position, and the target page is a sub-page contained in the main page. Therefore, the technical problem that the local layout of the page document cannot be flexibly controlled to return to the top in the local space in the prior art is solved, and the user can freely choose the sub-page to quickly return to the desired position according to their needs, avoiding a lot of code writing, improving user development efficiency, and enhancing business usage scenarios, such as supporting various scenarios such as excessive comments in the floating window and the need to scroll the local layout.
[0077] Figure 6 An exemplary system architecture 600 to which the page control method or the page control apparatus according to the embodiment of the present invention can be applied is shown.
[0078] like Figure 6 As shown, system architecture 600 may include terminal devices 601, 602, 603, network 604 and server 605. Network 604 is used to provide a medium for communication links between terminal devices 601, 602, 603 and server 605. Network 604 may include various connection types, such as wired, wireless communication links or optical fiber cables, etc.
[0079] The user can use the terminal devices 601, 602, 603 to interact with the server 605 through the network 604 to receive or send messages, etc. Various communication client applications can be installed on the terminal devices 601, 602, 603, such as page control applications, web browser applications, search applications, instant messaging tools, email clients, social platform software, etc. (only as examples).
[0080] The terminal devices 601 , 602 , and 603 may be various electronic devices having a display screen and supporting web browsing, including but not limited to smart phones, tablet computers, laptop computers, and desktop computers, etc.
[0081] The server 605 may be a server that provides various services, such as a backend management server (only an example) that provides support for shopping websites browsed by users using the terminal devices 601, 602, and 603. The backend management server may analyze and process the received data such as product information query requests, and feed back the processing results (such as target push information, product information - only an example) to the terminal device.
[0082] It should be noted that the page control method provided in the embodiment of the present invention is generally executed by the server 605 , and accordingly, the page control device is generally disposed in the server 605 .
[0083] It should be understood that Figure 6The number of terminal devices, networks and servers in the embodiment is only for illustration. Any number of terminal devices, networks and servers may be provided according to implementation requirements.
[0084] Reference below Figure 7 , which shows a schematic diagram of the structure of a computer system 700 of a terminal device suitable for implementing an embodiment of the present invention. Figure 7 The terminal device shown is only an example and should not bring any limitation to the functions and scope of use of the embodiments of the present invention.
[0085] like Figure 7 As shown, the computer system 700 includes a central processing unit (CPU) 701, which can perform various appropriate actions and processes according to a program stored in a read-only memory (ROM) 702 or a program loaded from a storage part 708 into a random access memory (RAM) 703. In the RAM 703, various programs and data required for the operation of the system 700 are also stored. The CPU 701, the ROM 702, and the RAM 703 are connected to each other via a bus 704. An input / output (I / O) interface 705 is also connected to the bus 704.
[0086] The following components are connected to the I / O interface 705: an input section 706 including a keyboard, a mouse, etc.; an output section 707 including a cathode ray tube (CRT), a liquid crystal display (LCD), etc., and a speaker, etc.; a storage section 708 including a hard disk, etc.; and a communication section 709 including a network interface card such as a LAN card, a modem, etc. The communication section 709 performs communication processing via a network such as the Internet. A drive 710 is also connected to the I / O interface 705 as needed. A removable medium 711, such as a magnetic disk, an optical disk, a magneto-optical disk, a semiconductor memory, etc., is installed on the drive 710 as needed, so that a computer program read therefrom is installed into the storage section 708 as needed.
[0087] In particular, according to the embodiments disclosed in the present invention, the process described above with reference to the flowchart can be implemented as a computer software program. For example, the embodiments disclosed in the present invention include a computer program product, which includes a computer program carried on a computer-readable medium, and the computer program includes a program code for executing the method shown in the flowchart. In such an embodiment, the computer program can be downloaded and installed from the network through the communication part 709, and / or installed from the removable medium 711. When the computer program is executed by the central processing unit (CPU) 701, the above-mentioned functions defined in the system of the present invention are executed.
[0088] It should be noted that the computer-readable medium shown in the present invention may be a computer-readable signal medium or a computer-readable storage medium or any combination of the above two. The computer-readable storage medium may be, for example, but not limited to, an electrical, magnetic, optical, electromagnetic, infrared, or semiconductor system, device or device, or any combination of the above. More specific examples of computer-readable storage media may include, but are not limited to: an electrical connection with one or more wires, a portable computer disk, a hard disk, a random access memory (RAM), a read-only memory (ROM), an erasable programmable read-only memory (EPROM or flash memory), an optical fiber, a portable compact disk read-only memory (CD-ROM), an optical storage device, a magnetic storage device, or any suitable combination of the above. In the present invention, a computer-readable storage medium may be any tangible medium containing or storing a program that can be used by or in combination with an instruction execution system, device or device. In the present invention, a computer-readable signal medium may include a data signal propagated in a baseband or as part of a carrier wave, which carries a computer-readable program code. This propagated data signal may take a variety of forms, including but not limited to electromagnetic signals, optical signals, or any suitable combination of the above. Computer-readable signal media may also be any computer-readable medium other than computer-readable storage media, which may send, propagate or transmit a program for use by or in conjunction with an instruction execution system, apparatus or device. The program code contained on the computer-readable medium may be transmitted using any appropriate medium, including but not limited to: wireless, wire, optical cable, RF, etc., or any suitable combination of the above.
[0089] The flow chart and block diagram in the accompanying drawings illustrate the possible architecture, function and operation of the system, method and computer program product according to various embodiments of the present invention. In this regard, each box in the flow chart or block diagram can represent a module, a program segment, or a part of a code, and the above-mentioned module, program segment, or a part of a code contains one or more executable instructions for realizing the specified logical function. It should also be noted that in some alternative implementations, the functions marked in the box can also occur in a different order from the order marked in the accompanying drawings. For example, two boxes represented in succession can actually be executed substantially in parallel, and they can sometimes be executed in the opposite order, depending on the functions involved. It should also be noted that each box in the block diagram or flow chart, and the combination of the boxes in the block diagram or flow chart can be implemented with a dedicated hardware-based system that performs a specified function or operation, or can be implemented with a combination of dedicated hardware and computer instructions.
[0090] The modules involved in the embodiments of the present invention may be implemented by software or hardware. The modules described may also be set in a processor, for example, it may be described as: a processor includes a determination module, an input module, an acquisition module and a control module. The names of these modules do not constitute a limitation on the modules themselves in some cases, for example, the determination module may also be described as "a module for determining a target page according to a received page control instruction".
[0091] As another aspect, the present invention also provides a computer-readable medium, which may be included in the device described in the above embodiment; or it may exist independently and not be assembled into the device. The above computer-readable medium carries one or more programs, and when the above one or more programs are executed by a device, the device includes: determining a target page according to a received page control instruction, wherein the target page is a subpage contained in a main page; passing the identifier of the target page into a pre-configured return component, and binding a scrolling event to the target page; when the target page scrolls, monitoring the scrolling of the target page using the scrolling event to obtain the scrolling distance of the target page; when the scrolling distance is greater than a preset distance threshold, controlling the target page to return to a preset position according to the pre-configured return component.
[0092] According to the technical solution of the embodiment of the present invention, it is possible to adopt a technical means of passing the identifier of the target page into a pre-configured return component to realize the quick return of the target page to a preset position, and the target page is a sub-page contained in the main page. Therefore, the technical problem that the local layout of the page document cannot be flexibly controlled to return to the top in the local space in the prior art is solved, and the user can freely choose the sub-page to quickly return to the desired position according to their needs, avoiding a lot of code writing, improving user development efficiency, and enhancing business usage scenarios, such as supporting various scenarios such as excessive comments in the floating window and the need to scroll the local layout.
[0093] The above specific implementations do not constitute a limitation on the protection scope of the present invention. It should be understood by those skilled in the art that various modifications, combinations, sub-combinations and substitutions may occur depending on design requirements and other factors. Any modification, equivalent substitution and improvement made within the spirit and principle of the present invention shall be included in the protection scope of the present invention.
Claims
1. A page control method, characterized in that: include: Determine a target page according to the received page control instruction, wherein the target page is a subpage included in the main page; The identifier of the target page is passed into a pre-configured return component, and a scroll event is bound to the target page; wherein the pre-configuration of the return component includes: introducing a return-to-top component in a user interface design component library, rewriting the return-to-top component, so as to customize the properties of the return-to-top component; wrapping an external container around the rewritten return-to-top component; controlling the display state of the external container through a display variable of the external container to control the display state of the return-to-top component, and binding a click return method to the external container; When the target page scrolls, the scrolling of the target page is monitored by using the scrolling event to obtain the scrolling distance of the target page; When the scrolling distance is greater than a preset distance threshold, the target page is controlled to return to a preset position according to the preconfigured return component.
2. The method according to claim 1, characterized in that The rewriting of the return to top component comprises: Adding a display attribute to the return-to-top component to put the return-to-top component in a display state; Set the size and position properties of the back-to-top component.
3. The method according to claim 1, characterized in that When the scrolling distance is greater than a preset distance threshold, controlling the target page to return to a preset position according to the preconfigured return component includes: When the scroll distance is greater than the preset distance threshold, updating the display variable of the external container to be true, so as to control the return to top component to be displayed on the target page; If the operation of clicking the return to top component is obtained, the click return method is triggered, and the target page is controlled to return to the preset position according to the return distance in the click return method.
4. The method according to claim 3, characterized in that The page control instruction indicates the preset position, and the return distance is set according to the preset position; as well as, The step of controlling the target page to return to the preset position according to the return distance in the click return method includes: If the preset position is the top, controlling the page data of the target page to return to the top of the target page according to the return distance; If the preset position is a specific position, the page data of the target page is controlled to return to the specific position of the target page according to the return distance.
5. A page control device, characterized in that: include: A determination module, used to determine a target page according to the received page control instruction, wherein the target page is a subpage included in the main page; The input module is used to input the identifier of the target page into the pre-configured return component, and bind a scroll event to the target page; it is also used to introduce a return-to-top component in the user interface design component library, rewrite the return-to-top component, so as to customize the properties of the return-to-top component; wrap an external container around the rewritten return-to-top component to obtain the pre-configured return component; control the display state of the external container through the display variable of the external container to control the display state of the return-to-top component, and bind a click return method to the external container; an acquisition module, configured to monitor the scrolling of the target page by using the scrolling event to obtain the scrolling distance of the target page when the target page scrolls; The control module is used to control the target page to return to a preset position according to the pre-configured return component when the scrolling distance is greater than a preset distance threshold.
6. An electronic device, characterized in that: include: one or more processors; a storage device for storing one or more programs, When the one or more programs are executed by the one or more processors, the one or more processors implement the method according to any one of claims 1 to 4.
7. A computer readable medium having a computer program stored thereon, characterized in that: When the program is executed by a processor, the method according to any one of claims 1 to 4 is implemented.
Citation Information
Patent Citations
Playing method and device of video elements in web page
CN104268251A
Method and device for controlling page
CN105630339A
