Full-selection optimization method and device for rolling loading page

Abstract

The invention discloses a full-selection optimization method and device for rolling loading pages, and the method comprises the steps: a client side obtains the total amount of page data through transmitting a data request to a server, and loads and sets the page data; the client calculates the total height of the page and sets the scroll bar length of the page; the client enters a full-selection mode and judges whether the full-selection mode is kept or not according to the click operation action of the user; when the client is in the full-selection mode, an operation instruction is generated according to the click operation action of a user, and the operation instruction and the unselected element list are sent to the server for processing; and when the client is in the non-full-selection mode, the selected element list is sent to the server for processing. All files in the current folder can be quickly selected, and the use experience of a user is improved. Meanwhile, after full selection, reverse selection can be supported, and the applicability of the system is enhanced.

Description

Technical Field

[0001] The present invention relates to the technical field of network page operation, and in particular to a full selection optimization method and device for scrolling loading pages. Background Art

[0002] At present, the common way to turn pages on the Web is to automatically load the next page when scrolling down. When the data has not been fully loaded, this operation method selects the "currently loaded data" when clicking "Select All". In most cases, users want to select all files in the current folder. Therefore, when the Web handles a large amount of data, this method of selecting all affects the user experience.

[0003] Therefore, how to invent a method for selecting all files in a scrolling loading page so as to quickly select all files in the current folder and improve the user experience has become an urgent problem to be solved. Summary of the invention

[0004] To this end, the present invention provides a method and device for optimizing the selection of all files in a scrolling loading page, which can quickly select all files in the current folder and improve the user experience. At the same time, after selecting all files, reverse selection can also be supported, which enhances the applicability of the system.

[0005] In order to achieve the above object, the present invention provides the following technical solution: a method for optimizing full selection of scrolling loading pages, comprising:

[0006] The client obtains the total amount of page data and loads and sets the page data by sending a data request to the server; the client calculates the total height of the page according to the total amount of page data; the client sets the scroll bar length of the page according to the total height of the page;

[0007] The client enters the select all mode and determines whether to maintain the select all mode based on the user's click operation; if the client maintains the select all mode, the element clicked by the user is added to the list of unselected elements; if the client switches to the non-select all mode, the element clicked by the user is added to the list of selected elements;

[0008] When the client is in the select all mode, an operation instruction is generated according to the user's click operation action, and the operation instruction and the unselected element list are sent to the server for processing; when the client is in the non-select all mode, the selected element list is sent to the server for processing.

[0009] As a preferred solution of a method for optimizing full selection of scrolling loading pages, in the process of calculating the total height of the page according to the total amount of the page data, the calculation formula of the total height of the page is:

[0010] H=N×h

[0011] Where H is the total height of the page; N is the total amount of page data; h is the height of each page of data.

[0012] As a preferred solution for a full selection optimization method for scrolling loading pages, when the client remains in full selection mode, the variable selectAll in the client is changed from False to True; the unselected element list is set to: excludeList, which is used to record the unselected element list in full selection mode; the selected element list is set to: checkedList, which is used to record the selected element list in non-full selection mode.

[0013] As a preferred solution for a method of optimizing full selection of scrolling loaded pages, when the client enters the full selection mode and determines whether to maintain the full selection mode based on the user's click operation, the event event triggered by the browser is used to determine whether the user presses the "Ctrl" key during the operation.

[0014] As a preferred solution of a full selection optimization method for scrolling loading pages, when the server processes the unselected element list, the server screens the unselected element list, generates a new operation set, and performs operation processing according to the new operation set.

[0015] The present invention also provides a device for optimizing full selection of a scrolling loaded page, based on the above method for optimizing full selection of a scrolling loaded page, comprising:

[0016] The client initialization module is used for the client to obtain the total amount of page data by sending a data request to the server, and load and set the page data; the client calculates the total height of the page according to the total amount of page data; the client sets the scroll bar length of the page according to the total height of the page;

[0017] The select all / non-select all mode data processing module is used for the client to enter the select all mode and determine whether to maintain the select all mode according to the user's click operation action; if the client maintains the select all mode, the element clicked by the user is added to the list of unselected elements; if the client switches to the non-select all mode, the element clicked by the user is added to the list of selected elements;

[0018] The select all / non-select all mode data feedback module is used to generate an operation instruction according to the user's click operation action when the client is in the select all mode, and send the operation instruction and the non-selected element list to the server for processing; when the client is in the non-select all mode, the selected element list is sent to the server for processing.

[0019] As a preferred solution of a fully selected optimization device for scrolling loading pages, in the client initialization module, in the process of calculating the total height of the page according to the total amount of the page data, the calculation formula of the total height of the page is:

[0020] H=N×h

[0021] Where H is the total height of the page; N is the total amount of page data; h is the height of each page of data.

[0022] As a preferred solution for a full selection optimization device for scrolling loading pages, in the full selection / non-full selection mode data processing module, when the client remains in full selection mode, the variable selectAll in the client is changed from False to True; the unselected element list is set to: excludeList, which is used to record the list of unselected elements in the full selection mode; the selected element list is set to: checkedList, which is used to record the list of selected elements in the non-full selection mode.

[0023] As a preferred solution for a full selection optimization device for scrolling loading pages, in the full selection / non-full selection mode data processing module, when the client enters the full selection mode and determines whether to maintain the full selection mode based on the user's click operation, the event event triggered by the browser is used to determine whether the user presses the "Ctrl" key during the operation.

[0024] As a preferred solution for a full selection optimization device for scrolling loading pages, in the full selection / non-full selection mode data feedback module, while the server is processing the unselected element list, the server filters the unselected element list, generates a new operation set, and performs operation processing according to the new operation set.

[0025] The present invention has the following advantages: the client obtains the total amount of page data by sending a data request to the server, and loads and sets the page data; the client calculates the total height of the page according to the total amount of page data; the client sets the scroll bar length of the page according to the total height of the page; the client enters the full selection mode, and determines whether to maintain the full selection mode according to the user's click operation action; if the client maintains the full selection mode, the element clicked by the user is added to the unselected element list; if the client switches to the non-full selection mode, the element clicked by the user is added to the selected element list; when the client is in the full selection mode, an operation instruction is generated according to the user's click operation action, and the operation instruction and the unselected element list are sent to the server for processing; when the client is in the non-full selection mode, the selected element list is sent to the server for processing. The present invention improves the user's experience of clicking "full selection" and improves the user's use experience. In the case of processing a large amount of data, only a small amount of rule descriptions need to be transmitted instead of the entire data list, which improves the efficiency of the system and reduces the system burden. At the same time, after the full selection, the present invention can also support reverse selection, which enhances the applicability of the system. BRIEF DESCRIPTION OF THE DRAWINGS

[0026] In order to more clearly illustrate the implementation methods of the present invention or the technical solutions in the prior art, the following briefly introduces the drawings required for the implementation methods or the description of the prior art. Obviously, the drawings in the following description are only exemplary, and for ordinary technicians in this field, other implementation drawings can be derived from the provided drawings without creative work.

[0027] The structures, proportions, sizes, etc. illustrated in this specification are only used to match the contents disclosed in the specification so as to facilitate understanding and reading by persons familiar with the technology. They are not used to limit the conditions under which the present invention can be implemented, and therefore have no substantial technical significance. Any structural modification, change in proportion or adjustment of size shall still fall within the scope of the technical contents disclosed in the present invention without affecting the effects and purposes that can be achieved by the present invention.

[0028] Figure 1 A schematic flow chart of a method for optimizing full selection of a scrolling loading page provided in Embodiment 1 of the present invention;

[0029] Figure 2 A schematic diagram of a specific implementation operation flow of a method for optimizing the selection of all scrolling loading pages provided in Embodiment 1 of the present invention;

[0030] Figure 3 A schematic diagram of file selection in a traditional select all mode in a possible embodiment provided in embodiment 1 of the present invention;

[0031] Figure 4A schematic diagram of file selection in an optimized select all mode in a possible embodiment provided in embodiment 1 of the present invention;

[0032] Figure 5 A schematic diagram of reverse selection of files in an optimized select all mode in a possible embodiment provided in embodiment 1 of the present invention;

[0033] Figure 6 This is a schematic diagram of the architecture of a fully selected optimization device for scrolling loading pages provided in Example 2 of the present invention. DETAILED DESCRIPTION

[0034] The following is a description of the implementation of the present invention by specific embodiments. People familiar with the art can easily understand other advantages and effects of the present invention from the contents disclosed in this specification. Obviously, the described embodiments are part of the embodiments of the present invention, not all of the embodiments. Based on the embodiments of the present invention, all other embodiments obtained by ordinary technicians in this field without creative work are within the scope of protection of the present invention.

[0035] Example 1

[0036] See also Figure 1 and Figure 2 Embodiment 1 of the present invention provides a method for optimizing full selection of a scrolling loading page, comprising the following steps:

[0037] S1. The client obtains the total amount of page data by sending a data request to the server, and loads and sets the page data; the client calculates the total height of the page according to the total amount of page data; the client sets the scroll bar length of the page according to the total height of the page;

[0038] S2, the client enters the select all mode, and determines whether to maintain the select all mode according to the user's click operation action; if the client maintains the select all mode, the element clicked by the user is added to the list of unselected elements; if the client switches to the non-select all mode, the element clicked by the user is added to the list of selected elements;

[0039] S3. When the client is in the select all mode, an operation instruction is generated according to the user's click operation action, and the operation instruction and the unselected element list are sent to the server for processing; when the client is in the non-select all mode, the selected element list is sent to the server for processing.

[0040] In this embodiment, in step S1, the client obtains the total amount of page data and loads the set page data by sending a data request to the server;

[0041] Specifically, when the client is initialized, it first sends a request to the server to obtain the total number of data corresponding to the current page, N. After receiving the request, the server calculates the total number of data items that meet the conditions in the database and sends this value N back to the client. When the client is initialized, in addition to requesting the total amount of data N, it also requests the data of the first k pages, usually k is set to 1 to several pages. These data are used to fill the initial display part of the page.

[0042] In order to reduce the pressure on the server and network, the system adopts a "delayed loading" strategy, that is, detailed data is requested from the server only when the user really needs the data.

[0043] In this embodiment, the client calculates the total height of the page according to the total amount of page data;

[0044] Specifically, the client calculates the total height H required for the entire page according to the total data volume N. The calculation formula for the total height of the page is:

[0045] H=N×h

[0046] Where H is the total height of the page; N is the total amount of page data; h is the height of each page of data.

[0047] In this embodiment, the client sets the scroll bar length of the page according to the total height of the page;

[0048] Specifically, the client dynamically sets the scroll bar length of the page according to the total page height H, so that the user visually feels that all data has been loaded. When the user scrolls, it is determined whether new data needs to be loaded according to the current scroll position, and the scroll bar is dynamically updated.

[0049] The scroll detection algorithm of the client is: when the user scrolls, the scroll listener is used to calculate the current position, for example, triggered by the onScroll event in the browser, and body.scrollTop is used to determine whether new data needs to be loaded.

[0050] In this embodiment, in step S2, the client enters the select all mode, and determines whether to maintain the select all mode according to the user's click operation action; if the client maintains the select all mode, the element clicked by the user is added to the unselected element list; if the client switches to the non-select all mode, the element clicked by the user is added to the selected element list;

[0051] Specifically, first define the key internal variables of the client, selectAll: Boolean value, used to record whether it is in full selection mode, the default is False; the unselected element list is set to: excludeList, used to record the unselected element list in full selection mode; the selected element list is set to: checkedList, used to record the selected element list in non-full selection mode.

[0052] When the user clicks the "Select All" button, the client sets the internal variable selectAll to True. At this time, the client does not immediately request detailed information about all data, but instead records the user's selection status until the user performs a specific operation and then performs further processing.

[0053] When the user performs a click operation in the "Select All" mode, check whether the user presses the "Ctrl" key during the operation. If the "Ctrl" key is pressed, keep selectAll equal to True (Select All mode) and add the clicked element to excludeList; if the "Ctrl" key is not pressed, the selectAll variable will be reset to False (Non-Select All mode) and the selected element will be added to checkedList.

[0054] Among them, in the process of checking whether the user presses the "Ctrl" key during the operation, it can generally be judged through the event event triggered by the browser. For example, event.type equals mousedown, which means that the user performed a mouse click event; event.ctrlKey equals true, which means that the user pressed the "Ctrl" key while clicking the mouse.

[0055] In this embodiment, in step S3, when the client is in the select all mode, an operation instruction is generated according to the user's click operation action, and the operation instruction and the unselected element list are sent to the server for processing; when the client is in the non-select all mode, the selected element list is sent to the server for processing.

[0056] Specifically, in the select all mode, when the user confirms an operation (such as copy, move or delete), the client does not send the specific content of all data to the server, but generates an instruction including the operation mode. For example:

[0057] selectAll=True:Indicates that the current operation is based on the "select all" mode;

[0058] excludeList = [A, B, C]: A, B, C are the items that the user manually deselects in the "Select All" mode. After receiving the instruction, the server operates the database to exclude the specified items according to the excludeList list, and performs corresponding operations on the remaining items.

[0059] In the process of the server processing the unselected element list, the server screens the unselected element list, generates a new operation set, and performs operation processing according to the new operation set.

[0060] In non-select all mode, the client only passes the specific list of items selected by the user to the server. For example:

[0061] selectAll=False: indicates that the user has not selected the "select all" mode;

[0062] checkedList = [X, Y, Z]: X, Y, Z are the items selected by the user. The server performs corresponding operations on the specified items according to the checkedList list.

[0063] In a possible embodiment, a specific file selection example is provided as follows:

[0064] For traditional scrolling loading pages, no matter how many files there are in the actual folder, you can only select the currently displayed data. Figure 3 As shown, there are tens of thousands of files in this file, but only "400 selected" are displayed.

[0065] The optimized full selection method of the present invention is adopted, such as Figure 4 As shown, the user experience is consistent with selecting all files locally on the computer.

[0066] At the same time, if Figure 5 As shown, the all-selection optimized by the method of the present invention can also support reverse selection after all-selection.

[0067] In summary, the client of the present invention obtains the total amount of page data and loads the set page data by sending a data request to the server; the client calculates the total height of the page according to the total amount of page data; the client sets the scroll bar length of the page according to the total height of the page; the client enters the select all mode, and determines whether to maintain the select all mode according to the user's click operation action; if the client maintains the select all mode, the element clicked by the user is added to the unselected element list; if the client switches to the non-select all mode, the element clicked by the user is added to the selected element list; when the client is in the select all mode, an operation instruction is generated according to the user's click operation action, and the operation instruction and the unselected element list are sent to the server for processing; when the client is in the non-select all mode, the selected element list is sent to the server for processing. The present invention improves the user's experience of clicking "select all" and improves the user's experience. In the case of processing a large amount of data, only a small amount of rule descriptions need to be transmitted instead of the entire data list, which improves the efficiency of the system and reduces the system burden. At the same time, after selecting all, the present invention can also support reverse selection, which enhances the applicability of the system.

[0068] It should be noted that the method of the embodiment of the present disclosure can be performed by a single device, such as a computer or a server. The method of the present embodiment can also be applied in a distributed scenario and completed by multiple devices cooperating with each other. In the case of such a distributed scenario, one of the multiple devices can only perform one or more steps in the method of the embodiment of the present disclosure, and the multiple devices will interact with each other to complete the described method.

[0069] It should be noted that the above describes some embodiments of the present disclosure. Other embodiments are within the scope of the appended claims. In some cases, the actions or steps recorded in the claims can be performed in an order different from that in the above embodiments and still achieve the desired results. In addition, the processes depicted in the accompanying drawings do not necessarily require the specific order or continuous order shown to achieve the desired results. In some embodiments, multitasking and parallel processing are also possible or may be advantageous.

[0070] Example 2

[0071] See also Figure 6 Embodiment 2 of the present invention further provides a fully selected optimization device for scrolling loading pages, comprising:

[0072] The client initialization module 001 is used for the client to obtain the total amount of page data by sending a data request to the server, and load and set the page data; the client calculates the total height of the page according to the total amount of page data; the client sets the scroll bar length of the page according to the total height of the page;

[0073] The select all / non-select all mode data processing module 002 is used for the client to enter the select all mode, and determine whether to maintain the select all mode according to the user's click operation action; if the client maintains the select all mode, the element clicked by the user is added to the unselected element list; if the client switches to the non-select all mode, the element clicked by the user is added to the selected element list;

[0074] The select all / non-select all mode data feedback module 003 is used to generate an operation instruction according to the user's click operation action when the client is in the select all mode, and send the operation instruction and the unselected element list to the server for processing; when the client is in the non-select all mode, the selected element list is sent to the server for processing.

[0075] In this embodiment, in the client initialization module 001, in the process of the client calculating the total height of the page according to the total amount of the page data, the calculation formula of the total height of the page is:

[0076] H=N×h

[0077] Where H is the total height of the page; N is the total amount of page data; h is the height of each page of data.

[0078] In this embodiment, in the select all / non-select all mode data processing module 002, when the client remains in the select all mode, the variable selectAll in the client is changed from False to True; the unselected element list is set to: excludeList, which is used to record the list of unselected elements in the select all mode; the selected element list is set to: checkedList, which is used to record the list of selected elements in the non-select all mode.

[0079] In this embodiment, in the select all / non-select all mode data processing module 002, when the client enters the select all mode and determines whether to maintain the select all mode based on the user's click operation, the event event triggered by the browser is used to determine whether the user presses the "Ctrl" key during the operation.

[0080] In this embodiment, in the all-select / non-all-select mode data feedback module 003, when the server processes the unselected element list, the server screens the unselected element list, generates a new operation set, and performs operation processing according to the new operation set.

[0081] It should be noted that the information interaction, execution process and other contents between the modules of the above-mentioned system are based on the same concept as the method embodiment in Example 1 of the present application, and the technical effects they bring are the same as those of the method embodiment of the present application. For specific contents, please refer to the description in the method embodiment shown above in the present application, and will not be repeated here.

[0082] Example 3

[0083] Embodiment 3 of the present invention provides a non-transitory computer-readable storage medium, in which a program code for a method for optimizing the full selection of a scrolling loaded page is stored. The program code includes instructions for executing embodiment 1 or any possible implementation method of a method for optimizing the full selection of a scrolling loaded page.

[0084] The computer-readable storage medium may be any available medium that can be accessed by a computer or a data storage device such as a server or a data center that includes one or more available media. The available medium may be a magnetic medium (e.g., a floppy disk, a hard disk, a tape), an optical medium (e.g., a DVD), or a semiconductor medium (e.g., a solid-state drive (SSD)).

[0085] Example 4

[0086] Embodiment 4 of the present invention provides an electronic device, including: a memory and a processor;

[0087] The processor and the memory communicate with each other via a bus; the memory stores program instructions that can be executed by the processor, and the processor calls the program instructions to execute a full selection optimization method for scrolling loading pages in embodiment 1 or any possible implementation thereof.

[0088] Specifically, the processor can be implemented by hardware or by software. When implemented by hardware, the processor can be a logic circuit, an integrated circuit, etc.; when implemented by software, the processor can be a general-purpose processor implemented by reading software codes stored in a memory. The memory can be integrated in the processor or can be located outside the processor and exist independently.

[0089] In the above embodiments, it can be implemented in whole or in part by software, hardware, firmware or any combination thereof. When implemented using software, it can be implemented in whole or in part in the form of a computer program product. The computer program product includes one or more computer instructions. When the computer program instructions are loaded and executed on a computer, the process or function described in the embodiment of the present invention is generated in whole or in part. The computer can be a general-purpose computer, a special-purpose computer, a computer network, or other programmable systems. The computer instructions can be stored in a computer-readable storage medium, or transmitted from a computer-readable storage medium to another computer-readable storage medium, for example, the computer instructions can be transmitted from a website site, computer, server or data center by wired (e.g., coaxial cable, optical fiber, digital subscriber line (DSL)) or wireless (e.g., infrared, wireless, microwave, etc.) mode to another website site, computer, server or data center.

[0090] Obviously, those skilled in the art should understand that the above modules or steps of the present invention can be implemented by a general computing system, they can be concentrated on a single computing system, or distributed on a network composed of multiple computing systems, and optionally, they can be implemented by a program code executable by a computing system, so that they can be stored in a storage system and executed by the computing system, and in some cases, the steps shown or described can be executed in a different order than here, or they can be made into individual integrated circuit modules, or multiple modules or steps therein can be made into a single integrated circuit module for implementation. Thus, the present invention is not limited to any specific combination of hardware and software.

[0091] Although the present invention has been described in detail above by general description and specific embodiments, it is obvious to those skilled in the art that some modifications or improvements can be made to the present invention. Therefore, these modifications or improvements made without departing from the spirit of the present invention all belong to the scope of protection claimed by the present invention.

Claims

1. A method for optimizing full selection of scrolling loading pages, characterized in that: include: The client sends a data request to the server to obtain the total amount of page data and load the set page data; The client calculates the total height of the page according to the total amount of the page data; The client sets the scroll bar length of the page according to the total height of the page; The client enters the select all mode and determines whether to maintain the select all mode based on the user's click operation; if the client maintains the select all mode, the element clicked by the user is added to the list of unselected elements; If the client switches to non-select all mode, the element clicked by the user is added to the list of selected elements; When the client is in the select all mode, an operation instruction is generated according to the user's click operation action, and the operation instruction and the unselected element list are sent to the server for processing; When the client is in non-select all mode, the selected element list is sent to the server for processing.

2. A method for optimizing full selection of scrolling loading pages according to claim 1, characterized in that: In the process of calculating the total height of the page according to the total amount of the page data, the calculation formula of the total height of the page is: H=N×h Where H is the total height of the page; N is the total amount of page data; h is the height of each page of data.

3. A method for optimizing full selection of scrolling loading pages according to claim 2, characterized in that: When the client remains in the select all mode, the variable selectAll in the client changes from False to True; the unselected element list is set to excludeList, which is used to record the unselected element list in the select all mode; the selected element list is set to checkedList, which is used to record the selected element list in the non-select all mode.

4. The method for optimizing full selection of scrolling loading pages according to claim 3, characterized in that: When the client enters the select all mode and determines whether to maintain the select all mode based on the user's click operation, the event event triggered by the browser is used to determine whether the user presses the "Ctrl" key during the operation.

5. A method for optimizing full selection of scrolling loading pages according to claim 4, characterized in that: In the process of the server processing the unselected element list, the server screens the unselected element list, generates a new operation set, and performs operation processing according to the new operation set.

6. A device for optimizing full selection of a scrolling loaded page, using a method for optimizing full selection of a scrolling loaded page according to any one of claims 1 to 5, characterized in that: include: The client initialization module is used for the client to obtain the total amount of page data and load the set page data by sending a data request to the server; The client calculates the total height of the page according to the total amount of the page data; the client sets the scroll bar length of the page according to the total height of the page; The select all / non-select all mode data processing module is used for the client to enter the select all mode and determine whether to maintain the select all mode according to the user's click operation action; if the client maintains the select all mode, the element clicked by the user is added to the list of unselected elements; If the client switches to non-select all mode, the element clicked by the user is added to the list of selected elements; The select all / non-select all mode data feedback module is used to generate an operation instruction according to the user's click operation action when the client is in the select all mode, and send the operation instruction and the non-selected element list to the server for processing; When the client is in non-select all mode, the selected element list is sent to the server for processing.

7. The device for optimizing full selection of scrolling loading pages according to claim 6, characterized in that: In the client initialization module, in the process of calculating the total height of the page according to the total amount of the page data, the calculation formula of the total height of the page is: H=N×h Where H is the total height of the page; N is the total amount of page data; h is the height of each page of data.

8. The device for optimizing full selection of scrolling loading pages according to claim 7, characterized in that: In the select all / non-select all mode data processing module, when the client remains in the select all mode, the variable selectAll in the client changes from False to True; the unselected element list is set to: excludeList, which is used to record the list of unselected elements in the select all mode; the selected element list is set to: checkedList, which is used to record the list of selected elements in the non-select all mode.

9. The device for optimizing full selection of scrolling loading pages according to claim 8, characterized in that: In the select all / non-select all mode data processing module, when the client enters the select all mode and determines whether to maintain the select all mode based on the user's click operation, the event event triggered by the browser is used to determine whether the user presses the "Ctrl" key during the operation.

10. The device for optimizing full selection of scrolling loading pages according to claim 9, characterized in that: In the all-select / non-all-select mode data feedback module, the server responds to the unselected element list. During the processing, the server screens the unselected element list and generates a new operation set. And perform operation processing according to the new operation set.

Images