Method and device for configuring shortcut key in program developed based on browser webpage
By generating shortcut key text corresponding to the target page elements in the browser page, and using character keys and function key combinations, the complex configuration of shortcut keys in the browser web page is solved, and efficient operation without memory shortcut keys is achieved, reducing maintenance costs and improving user experience.
Patent Information
- Application Number
- CN202510891945.5
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- Filing Date
- 2025-06-30
- Publication Date
- 2025-07-29
- Estimated Expiration
- Not applicable · inactive patent
AI Technical Summary
The configuration of shortcut keys in existing browser web pages is complicated, which causes users to remember multiple shortcut keys. Different software and browsers use different shortcut keys, which increases maintenance costs and reduces work efficiency.
By obtaining the tag attributes of the target page element in the browser page, generating shortcut key text corresponding to each target page element, and displaying it in the browser page, shortcut keys are generated using character keys and function key combinations to avoid shortcut key conflicts and simplifying the operation process.
The shortcut keys are not required to remember users, which reduces the maintenance cost of shortcut keys, improves user work efficiency, reduces operation thresholds and error probability, and enhances the interactive visualization effect.
Smart Images

Figure CN120386459A_ABST
Abstract
Description
Technical Field
[0001] The present application relates to the technical field of computer software, and particularly to a method and device for configuring shortcut keys in a program developed based on browser web pages. Background Art
[0002] A shortcut key refers to a keyboard combination associated with a specific function or operation, which allows users to perform complex operations or commands through simple keyboard operations. By pressing these keyboard combinations, users can quickly execute certain operations or access certain functions. During the use of a computer, shortcut keys can effectively improve work efficiency. In various software and browser web pages, the use of shortcut keys has been very common, and users can achieve various functions through combinations of two keys, three keys or even more keys. For example, users can quickly implement operations such as copy, paste, undo and redo through shortcut keys. In browser web pages, shortcut keys can be used for forward, backward, opening a new tab, etc. Usually, these shortcut keys are assigned by developers during software or web page development, and developers can directly write the shortcut keys into the program for compilation for users to perform shortcut key function operations. However, with the increase in the number of shortcut keys, the keyboard shortcut keys that users need to remember become more and more complex, and different software and browser web pages may use different shortcut keys, and the shortcut keys that users are used to may also be different, resulting in a reduction in users' work efficiency and high maintenance costs for shortcut keys. Summary of the Invention
[0003] The present application provides a method and device for configuring shortcut keys in a program developed based on browser web pages, which do not require users to remember shortcut keys, can effectively improve users' work efficiency, and reduce the cost of maintaining shortcut keys.
[0004] In a first aspect, the present application provides a method for configuring shortcut keys in a program developed based on a browser web page. The method includes: displaying a browser page, where the browser page is composed of at least one page element, and at least one of the at least one page element includes at least one target page element associated with a tag attribute. Here, each browser page can be considered to be composed of multiple page elements, and a page element refers to text, multimedia, form, hyperlink, control, etc. displayed within the browser page. Through the tag attribute, the target page element that needs to configure the shortcut key can be found from each page element. Further, in response to the triggering operation of the target key, each target page element is obtained from at least one page element based on the tag attribute, and the shortcut key text corresponding to the shortcut key to be configured for each target page element is generated according to a preset rule, and each shortcut key text is displayed in the browser page. In the present application, the target page element in the browser page is first obtained, and then the shortcut key text corresponding to the shortcut key to be configured for the target page element is generated according to the preset rule. This way of first obtaining the target page element and then generating the shortcut key text is for the currently displayed browser page. In other words, when the browser page is updated, the target page element may change, but the shortcut key text corresponding to the shortcut key to be configured for the target page element in the new browser page can still be generated according to the preset rule, that is, in different browser pages, due to the same preset rule, the shortcut keys to be configured for the target page element and the shortcut key text may also be the same. It can be seen that the method for configuring shortcut keys in a program developed based on a browser web page provided by the present application can configure temporary shortcut keys for different browser pages, without the need for developers to specifically customize shortcut keys for browser pages, that is, without configuring shortcut keys during the development stage of browser pages, which can effectively reduce the development cost and the maintenance cost of shortcut keys. In addition, by displaying the shortcut key text in the browser page, there is no need for users to memorize the shortcut keys, and the effect of being able to view and use the shortcut keys at any time can be achieved, which can effectively improve the work efficiency of users and greatly reduce the operation threshold and error probability.
[0005] In a possible implementation, the above method further includes: obtaining a trigger event of each target page element, and generating a correspondence between each shortcut key and each trigger event, where the correspondence is used to indicate that when the shortcut key is triggered, the corresponding trigger event is executed, and the target page element includes at least one of a control, a multimedia, a form, a text, or a hyperlink. In this application, after generating a shortcut key for each target page element, a correspondence between each shortcut key and each trigger event can also be generated. Here, the correspondence between each shortcut key and each trigger event means that the shortcut key configured for each target page element is bound to the trigger event corresponding to the target page element. In this way, not only can a shortcut key be assigned to the trigger event of each target page element, but the situation of shortcut key conflicts caused by the reuse of shortcut keys can be effectively avoided, ensuring that when the shortcut key configured for the target page element is triggered, the trigger event corresponding to the target page element is executed.
[0006] In a possible implementation, the above method further includes: when it is detected that a target shortcut key in each shortcut key is triggered, executing the trigger event corresponding to the target shortcut key according to the correspondence. In this application, by configuring shortcut keys for target page elements, the operation process can be simplified, the operation can be completed more quickly, the operation convenience and work efficiency are improved, and time and labor costs are also saved.
[0007] In a possible implementation, generating shortcut key texts corresponding to the shortcut keys to be configured for each target page element according to a preset rule, and displaying each shortcut key text in a browser page, includes: generating shortcut keys to be configured for each target page element and the corresponding shortcut key texts based on a combination key composed of a character key and a function key; the character key is a target key, and the function key is a numeric key or a letter key. Further, creating a container element corresponding to each target page element at the root node of the browser page, and adding each shortcut key text to the corresponding container element to display each shortcut key text in the browser page. In this application, a temporary shortcut key can be configured for each target page element through the combination key composed of a character key and a function key, and the corresponding shortcut key text can also be generated. It is not necessary to configure shortcut keys during the development stage of the browser page, which can effectively reduce the development cost and the maintenance cost of shortcut keys. In addition, by using the container element to display the shortcut key text in the browser page, users do not need to remember the shortcut keys, which can effectively improve the work efficiency of users, reduce the operation threshold and the error probability.
[0008] In a possible implementation manner, the above method further includes: in response to a screen clearing operation for the shortcut key text, canceling the display of each shortcut key text in the browser page, and destroying the correspondence between each shortcut key and each trigger event; the screen clearing operation for the shortcut key text includes a second trigger operation of a target key. In the present application, the shortcut keys and the correspondence between the shortcut keys and the trigger events are only applicable to the current browser page. Therefore, when the user does not need to view the shortcut keys, the shortcut key text can be cleared from the screen to keep the screen clean. Destroying the original shortcut keys and the corresponding relationships can effectively reduce the maintenance cost of the shortcut keys.
[0009] In a possible implementation manner, the above method further includes: generating event text corresponding to each trigger event based on the trigger events of each target page element, and adding each event text to the corresponding container element to display each event text in the browser page. In the present application, by displaying the event text in the browser page, key information of the target page element can be provided for the user to assist the user in making decisions, reduce operation losses, enhance the visual effect of the prompt, facilitate the user to understand the function of the target page element, and improve the user experience.
[0010] In a second aspect, in a possible implementation manner, an embodiment of the present application provides a shortcut key configuration device in a program based on browser web development. The device includes: a display module for displaying a browser page, the browser page being composed of at least one page element, and at least one of the at least one page element includes at least one target page element associated with a label attribute; a processing module for, in response to a trigger operation of a target key, obtaining each target page element from the at least one page element based on the label attribute, generating shortcut key text corresponding to the shortcut keys to be configured for each target page element according to a preset rule, and displaying each shortcut key text in the browser page. In the present application, through each module in the device, the target page element can be found from the browser page based on the label attribute, and then shortcut keys and the corresponding shortcut key text are configured for each target page element, and each shortcut key text is displayed in the browser page, which can provide shortcut key information for the user to assist the user in making decisions, does not require the user to memorize the shortcut keys, improves the user's perception efficiency of the shortcut keys, enriches the interaction method between the browser page and the user, and enhances the visual effect of the interaction.
[0011] In a possible implementation, the above-mentioned device further includes: a service processing module, configured to obtain a trigger event of each target page element, and generate a correspondence between each shortcut key and each trigger event, where the correspondence is used to indicate that when the shortcut key is triggered, the corresponding trigger event is executed. The target page element includes at least one of a control, a multimedia, a form, a text, or a hyperlink. In this application, through the service processing module, the shortcut key configured for each target page element can be bound to the trigger event corresponding to the target page element. In this way, when the shortcut key is triggered, the corresponding trigger event can be executed, which is flexible in operation and improves the user's perception efficiency of the trigger event.
[0012] In a possible implementation, the above-mentioned service processing module is further configured to, when detecting that a target shortcut key in each shortcut key is triggered, execute the trigger event corresponding to the target shortcut key according to the correspondence.
[0013] In a possible implementation, the above-mentioned processing module includes: a first processing unit, configured to generate a shortcut key that each target page element needs to configure and a shortcut key text corresponding to each shortcut key based on a combination key composed of a character key and a function key; the character key is a target key, and the function key is a numeric key or an alphabetic key. A second processing unit, configured to create a container element corresponding to each target page element at the root node of the browser page, and add each shortcut key text to the corresponding container element, so as to display each shortcut key text in the browser page.
[0014] In a possible implementation, the above-mentioned display module is further configured to, in response to a screen clearing operation on the shortcut key text, cancel the display of each shortcut key text in the browser page and destroy the correspondence between each shortcut key and each trigger event; the screen clearing operation on the shortcut key text includes a second trigger operation of the target key. In this application, through the display module, when the user does not need to view the shortcut keys, the shortcut key text can be cleared from the screen to keep the screen clean, enriching the interaction mode between the browser page and the user and enhancing the visual effect of the interaction.
[0015] In a possible implementation, the above-mentioned second processing unit is further configured to generate an event text corresponding to each trigger event based on the trigger event of each target page element, and add each event text to the corresponding container element, so as to display each event text in the browser page.
[0016] In a third aspect, an embodiment of the present application provides an electronic device, including: a display screen, an input / output device, a memory, and a processor. The memory is configured to store program code, and the display screen, the input / output device, and the processor are configured to call the program code to execute the method provided in the first aspect.
[0017] Fourthly, an embodiment of the present application provides a computer-readable storage medium, on which program instructions are stored, and when the program instructions are executed by an electronic device, the method provided in the first aspect is implemented.
[0018] Fifthly, an embodiment of the present application provides a computer program product. When the computer program product runs on an electronic device, the electronic device is enabled to execute the method provided in the first aspect. Description of the Drawings
[0019] Figure 1 is a schematic structural diagram of a network architecture provided by an embodiment of the present application; Figure 2 is a schematic flowchart of a shortcut key configuration method in a program developed based on a browser web page provided by the present application; Figure 3 is a schematic diagram of a browser page of a shortcut key configuration method in a program developed based on a browser web page provided by the present application; Figure 4 is another schematic diagram of a browser page of a shortcut key configuration method in a program developed based on a browser web page provided by the present application; Figure 5 is another schematic diagram of a browser page of a shortcut key configuration method in a program developed based on a browser web page provided by the present application; Figure 6 is another schematic diagram of a browser page of a shortcut key configuration method in a program developed based on a browser web page provided by the present application; Figure 7 is another schematic diagram of a browser page of a shortcut key configuration method in a program developed based on a browser web page provided by the present application; Figure 8 is another schematic diagram of a browser page of a shortcut key configuration method in a program developed based on a browser web page provided by the present application; Figure 9 is another schematic diagram of a browser page of a shortcut key configuration method in a program developed based on a browser web page provided by the present application; Figure 10 is another schematic diagram of a browser page of a shortcut key configuration method in a program developed based on a browser web page provided by the present application; Figure 11 is another schematic diagram of a browser page of a shortcut key configuration method in a program developed based on a browser web page provided by the present application; Figure 12 is another schematic diagram of a browser page of a shortcut key configuration method in a program developed based on a browser web page provided by the present application; Figure 13It is another schematic diagram of a browser page in a shortcut key configuration method in a program developed based on a browser web page provided by this application; Figure 14 It is another schematic diagram of a browser page in a shortcut key configuration method in a program developed based on a browser web page provided by this application; Figure 15 It is a schematic diagram of a device of a shortcut key configuration device in a program developed based on a browser web page provided by this application; Figure 16 It is a schematic diagram of the structure of an electronic device provided by an embodiment of this application. Detailed implementation manners
[0020] In order to make the purpose, technical solutions and advantages of this application clearer, the following further describes this application in detail with reference to the accompanying drawings and embodiments. It should be understood that the specific embodiments described herein are only used to explain this application and are not used to limit this application.
[0021] Please refer to Figure 1 , Figure 1 It is a schematic diagram of the structure of a network architecture provided by an embodiment of this application. As Figure 1 shown, the system architecture may include a server 10, an electronic device 20, a keyboard 30, and a mouse 40. Among them, the above server 10 may be an independent physical server, or a server cluster or distributed system composed of multiple physical servers, or a cloud server providing basic cloud computing services such as cloud databases, cloud services, cloud computing, cloud functions, cloud storage, network services, cloud communications, middleware services, domain name services, security services, CDN, and big data and artificial intelligence platforms. Among them, the electronic device 20 may be a smart phone, a tablet computer, a notebook computer, a desktop computer, a handheld computer, a wearable device (such as a smart watch, a smart bracelet, etc.), a smart TV, a smart vehicle, and other smart terminals. Among them, the keyboard 30 can be used to receive a trigger operation on a target key, and the above electronic device 20 can also execute a trigger event corresponding to the target key in response to the trigger operation of the target key.
[0022] It should be noted that when the user triggers the target key, in some feasible embodiments, the corresponding key on the keyboard 30 (i.e., the physical key) can be directly selected; in some other feasible embodiments, a corresponding key menu can be set on the interface displayed by the electronic device 20 so that the user can select the corresponding key from the key menu through the mouse 40; in some other feasible embodiments, it can also be a virtual keyboard corresponding to the keyboard 30 on the interface displayed by the electronic device 20, enabling the user to directly select (such as click) the virtual key through the mouse 40. This way can make the keyboard configuration more intuitive and simplified. Among them, in some embodiments, the mouse 40 can be a mechanical mouse, an optical mouse, a laser mouse, etc., which is not limited herein.
[0023] Optionally, the keyboard 30 can be a regular keyboard or a mechanical keyboard. Usually, rubber membrane switches are used. There is a rubber key membrane under these switches. When the key is pressed, the rubber key membrane will be compressed, thus closing the circuit and sending a signal to the electronic device 20. Each key on a mechanical keyboard has a mechanical switch below it. When the key is pressed, the switch will be triggered, closing the circuit and sending a signal to the electronic device 20. Different types of mechanical switches (such as linear, tactile, clicky) will bring different keystroke feelings and sounds.
[0024] In some feasible implementation manners, the keyboard 30 can be a backlit keyboard. A backlit keyboard refers to a keyboard with a backlight function. This kind of keyboard can illuminate the keys in a dark environment, enabling the user to clearly see the characters and key positions on the keyboard at night or in a dimly lit environment. In some other embodiments, the keyboard 30 can be a modular designed keyboard, and the various modules can be connected through detachable interfaces.
[0025] Among them, the server 10 can establish a communication connection with the electronic device 20, and the electronic device 20 can respectively establish communication connections with the keyboard 30 and the mouse 40. Among them, the above communication connection does not limit the connection method, and can be directly or indirectly connected through a wired communication method, or can be directly or indirectly connected through a wireless communication method, etc., which can be specifically determined according to the actual application scenario, and this application does not make any restrictions here. Exemplarily, in the case where the electronic device 20 can establish communication connections with the keyboard 30 and the mouse 40, the keyboard 30 and the mouse 40 can establish a wired communication connection with the electronic device 20 through the USB interface of the electronic device 20, or can establish a wireless communication connection with the electronic device 20 through methods such as Bluetooth (BT), wireless fidelity (Wi-Fi), Wi-Fi Direct, etc., or can establish a wireless communication connection with the electronic device 20 through methods such as near field communication (NFC), infrared technology (IR), or radio waves, etc., which can be specifically determined according to the actual application scenario, and no restrictions are made here.
[0026] It should be understood that a browser client (hereinafter referred to as a browser) should be installed in the electronic device 20, and the server 10 can provide background services for the browser running on the electronic device 20 and perform data interaction with the electronic device 20. For example, the server 10 can receive an access request sent by the electronic device 20 for a browser page, and send the page data of the browser page to the electronic device 20, so that the electronic device 20 can display the browser page based on the page data and provide a user operation interface and interaction functions.
[0027] It should be understood that the data involved in the embodiments of this application can be stored in the electronic device 20, or the data can be stored based on cloud storage technology, and no restrictions are made here. The above data can be used to store various media, documents, etc. generated by the browser operation, as well as the personal accounts logged in by users in the browser and the configuration information of the personal accounts, etc., and no restrictions are made here. In the specific implementation manner of this application, for user-related data, such as the triggering operation of a target key, etc., when the embodiments of this application are applied to specific products or technologies, user permission or consent needs to be obtained, and the collection, use, and processing of relevant data need to comply with local laws, regulations, and standards.
[0028] Currently, in the traditional shortcut key configuration method, shortcut keys usually need to be configured by developers during the development stage. For example, in a browser page, when a piece of information data is selected, the Copy function can be achieved by using the shortcut key Ctrl+c, the Paste function by Ctrl+v, and the Cut function by Ctrl+x, etc. Usually, certain common functions can be quickly called by clicking the mouse and using common-sense shortcut keys. In other words, developers set a series of restrictions or branches in the code, and the corresponding function can be found through the configured shortcut keys, thereby implementing the corresponding function. When setting shortcut keys in this way, only one set of shortcut key rules can be executed on one page. Generally speaking, a shortcut key combination, such as Ctrl+C, can only correspond to one function. When a page consists of several components, the shortcut keys between components cannot be repeated, otherwise, one shortcut key may trigger two functions, and even the two functions may interfere with each other. This way is very likely to cause conflicts in the functions of shortcut keys, bringing inconvenience to users, requiring users to remember multiple shortcut keys, reducing work efficiency, and increasing the maintenance cost of shortcut keys.
[0029] To solve the above problems, the present application provides a method for configuring shortcut keys in a program based on browser web development. Please refer to Figure 2 , Figure 2 which is a schematic flowchart of a method for configuring shortcut keys in a program based on browser web development provided by the present application. The method for configuring shortcut keys in a program based on browser web development can be executed by an electronic device, and the electronic device can be a mobile terminal device, and the mobile terminal device can be a laptop computer, a desktop computer, a mobile phone, a tablet computer, etc., but is not limited thereto. For the convenience of description, the electronic device 20 shown in Figure 1 will be taken as an example for detailed description. A browser for loading a front-end page is installed on the electronic device 20. As shown in Figure 2 , the method may include the following steps: S101. Display a browser page, where the browser page consists of at least one page element, and at least one of the at least one page element includes at least one target page element associated with a tag attribute.
[0030] It should be understood that each browser page can be regarded as a Hypertext Markup Language (HTML) page. Each HTML page is actually composed of multiple page elements, which refer to text, multimedia, forms, hyperlinks, controls, etc. displayed within the browser page. Among them, each page element is composed of multiple types of element attributes. Some of these element attributes are related to the page layout and display effect of the element (such as the page coordinates of the starting position of the element, the shape of the element, the size of the element, the text font of the element, the text color of the element, etc.), which can be called layout attributes. The other part is related to the content of the element (such as the text content displayed by the element, the network link corresponding to the element, etc.), which can be called content attributes. Under normal circumstances, a front-end business page corresponds to two text files that meet the HTML syntax structure: a Cascading Style Sheets (CSS) file and an HTML / HTM file. The CSS file is used to save the layout attributes of all page elements, and the HTML / HTM file is used to save the content attributes of all page elements.
[0031] When a user performs an operation in the browser to access a browser page, such as clicking a link, a button, or entering a Uniform Resource Locator (URL) in the address bar of the browser, the browser will send an access request to the server. The server can return data for the browser page based on this access request. This access request usually contains the URL that the user wants to access (i.e., the address of the browser page) and other relevant information, such as the request method (add, query, delete, modify, etc.), the request headers (including the browser type, user agent, etc.), and possibly the request body (for an add request). Optionally, the browser page can be a page in a web application, and the user can access the web application through the browser. Exemplarily, the above web application can be Office Automation (OA), Enterprise Resource Planning (ERP), manufacturing execution system (MES), and industry software, etc.
[0032] In some feasible embodiments, when a user enters a URL or clicks on a link or button in a browser, the electronic device can send an access request to the server through the browser according to the user's request, and parse the data returned by the server into Web resources such as Hypertext Markup Language (HTML), Cascading Style Sheets (CSS), and JavaScript, and load and render these resources. After the Web resources are loaded, the browser page can be displayed in the browser to display the page content through the browser page, and provide a user operation interface and interaction functions.
[0033] Furthermore, the electronic device can, in response to the above access request, determine the page layout and page structure corresponding to the browser page according to the screen width size of the browser, a pre-configured CSS file, and an HTML file. Among them, different page layouts corresponding to different screen width sizes are pre-configured in the CSS file, and different page structures corresponding to different screen width sizes are pre-configured in the HTML file. The page layout represents the arrangement and combination of various elements in the web page, and the page structure represents the hierarchical relationship of the content in the web page. The hierarchical relationship of the content refers to the logical and organizational structure between the page contents. The hierarchical relationship of the content in the page determines the main content and secondary content, as well as their association and order. Page elements are the basic components that make up the browser page, and can be text, multimedia, forms, hyperlinks, controls, etc. Among them, the text can be descriptive text, such as headings, paragraphs, etc. Multimedia can be images, animations, audio, video, or audio-video, etc. Forms can collect data in the browser page. A hyperlink is a piece of text linked to a URL, and another document can be jumped to through the hyperlink. Controls can allow users to perform operations by clicking. Among them, a form consists of three parts: a form label, form fields, and form buttons. The form label contains the URL of the Common Gateway Interface (CGI) program used to process form data and the method of submitting data to the server. The form fields include text boxes, password boxes, hidden fields, multi-line text boxes, check boxes, radio boxes, drop-down selection boxes, and file upload boxes, etc. The form buttons include submit buttons, reset buttons, and general buttons, which can be used to send data to the CGI script on the server or cancel the input, and can also be used to control other processing operations that define the processing script.
[0034] Please refer to Figure 3 , Figure 3 is a schematic diagram of a browser page in a shortcut key configuration method in a program developed based on browser web pages provided by this application. As Figure 3As shown, the electronic device can display a browser page through a browser. The page content that can be displayed in this browser page includes text buttons or icon buttons with the words "Approval", "Transfer for Approval", "OK", "Cancel", text such as "Name:", "Email:", a title such as "Production Plan", a hyperlink such as "http: / / xxx", and pictures. Among them, when the user needs to submit an approval, they can click the "Approval" button, and the electronic device can respond to the click operation on the "Approval" button and submit the approval. When the user needs someone else to approve, they can click the "Transfer for Approval" button, and the electronic device can respond to the click operation on the "Transfer for Approval" button and submit the approval to others. When the user needs to save the content, they can click the "OK" button, and the electronic device can respond to the click operation on the "OK" button and save the content in the current page. When the user needs to cancel the approval, they can click the "Cancel" button, and the electronic device can respond to the click operation on the "Cancel" button and cancel the approval. In addition, when the user needs to view the content of the hyperlink, they can click the hyperlink such as "http: / / xxx", and the electronic device can respond to the click operation on the hyperlink and display the page of the above hyperlink. It should be understood that the types of the above hyperlinks can be text hyperlinks, image hyperlinks, E-mail links, anchor links, multimedia file links, empty links, etc., which can be specifically determined according to the actual application scenario and are not limited herein. As Figure 3 shown, the above browser page may further include an image (such as Image a). When the user needs to view the image, they can click the image, and the electronic device can respond to the click operation on the image and select the image.
[0035] In some feasible implementation manners, among the page elements displayed in the browser page, there is at least one target page element associated with a tag attribute. It should be understood that the above target page element associated with the tag attribute can be a page element that needs to configure a shortcut key. Therefore, the target page element that needs to configure a shortcut key and the page element that does not need to configure a shortcut key can be distinguished through the tag attribute. In other words, the target page element that needs to configure a shortcut key can be found from the page elements of the browser through the tag attribute. Among them, the tag attribute can be preset by developers during the development stage, and the tag attribute can be any type of data. For example, English characters or numerical characters, which can be specifically determined according to the actual application scenario and are not limited in this application. Exemplarily, such as Figure 3As shown, assume that the "Approval" button, "Transfer for Approval" button, "OK" button, "Cancel" button, the hyperlink shown as "http: / / xxx", and image a are all associated with tag attributes. The electronic device can find these page elements, namely the "Approval" button, "Transfer for Approval" button, "OK" button, "Cancel" button, the hyperlink shown as "http: / / xxx", and image a, from the browser page according to the tag attributes. The page elements associated with tag attributes can be recorded as target page elements.
[0036] S102. In response to the triggering operation of the target key, obtain each target page element from at least one page element based on the tag attributes, generate shortcut key texts corresponding to the shortcut keys to be configured for each target page element according to the preset rules, and display each shortcut key text in the browser page.
[0037] In some feasible implementation manners, the target key can be a keyboard key. At this time, the electronic device can detect a keyboard event, that is, the electronic device can detect the triggering operation of the target key. Among them, a keyboard event is an event triggered when a user performs certain operations on the keyboard. Common keyboard events include keydown, keypress, and keyup. Among them, keydown can indicate that it is triggered when the user presses any key, whether it is a character key (such as Shift, Ctrl, Alt, etc.), a function key (such as a letter key, a number key, etc.), or a direction key, a keyboard event will be triggered. Keypress can indicate that it is triggered when the user presses a key that generates a character (such as a number key or a letter key), and a character key will not trigger this event. Keyup can indicate that it is triggered when the user releases a key and can be used to capture the end state of keyboard input. It can be seen that the electronic device can capture the action of the user pressing or releasing a keyboard key. By detecting the keyboard event, a richer interaction experience can be provided for the user. In other words, when the user triggers the target key, the electronic device can detect the keyboard event that the target key is pressed.
[0038] In some feasible embodiments, an electronic device can detect events (such as keyboard events, mouse events, etc.) through JavaScript. In JavaScript, an event defines various operations generated when a user interacts with a page. Through event detection, specific events occurring on the page can be detected, such as a user clicking a button, moving the mouse, pressing a keyboard key, etc. Optionally, an event object can be created through the Event constructor. An event object refers to an event object automatically created by the browser when an event is triggered in the browser, which stores information related to the current event, including the event type, event target, triggering element, etc. For example, a keyboard event object can be created through the KeyboardEvent constructor, including the type of the event (such as keydown, keypress, or keyup) and an optional parameter object, which can include various attributes of the keyboard event. Exemplarily, when the target key is the Alt key, a press event of the Alt key needs to be created and triggered. At this time, the type of the event is keydown, and the optional parameter object can include key, code, AltKey, etc. Among them, key is the Alt key, code is the key code 18 of Alt, and the AltKey event attribute can return a boolean value indicating whether the Alt key is pressed and held when the event occurs. Further, when the user presses the Alt key, the electronic device can detect that the Alt key is triggered. Optionally, the detection of keyboard events can be achieved through the createEvent method. Those skilled in the art should understand that details are not elaborated here. It should be understood that the present application does not limit the method for detecting keyboard events. Among them, a keyboard event can be bound to a certain triggering event. When the user executes a keyboard event, the electronic device can respond to the keyboard event and execute the triggering event corresponding to the above keyboard event. Exemplarily, when the target key is the Alt key, the triggering event can be to obtain each of the target page elements from the at least one page element based on the label attribute, generate shortcut key texts corresponding to the shortcut keys to be configured for each of the target page elements according to a preset rule, and display each of the shortcut key texts in the browser page. When the electronic device detects that Alt is pressed, the electronic device can respond to the keyboard event of Alt and execute the triggering event of obtaining each of the target page elements from the at least one page element based on the label attribute, generating shortcut key texts corresponding to the shortcut keys to be configured for each of the target page elements according to a preset rule, and displaying each of the shortcut key texts in the browser page.
[0039] In some feasible embodiments, the electronic device may generate a shortcut key required to be configured for each of the target page elements and shortcut key text corresponding to each shortcut key based on a combination key composed of a character key and a function key; the character key is the target key, and the function key is a numeric key or an alphabetic key. Further, the electronic device may create a container element corresponding to each of the target page elements at the root node of the browser page, and add each shortcut key text to each corresponding container element, so as to display each shortcut key text in the browser page.
[0040] It should be understood that the hierarchical structure of the browser page may be a Document Object Model (DOM). The nodes in the DOM node tree have a hierarchical relationship with each other, including: parent, child, and sibling nodes. Among them, in the node tree, the top node is called the root node, the parent node has child nodes, and the child nodes at the same level are called sibling nodes. A node may have any number of child nodes, and sibling nodes are nodes that have the same parent node. In some feasible embodiments, for the top node, that is, the root node, it has 2 child nodes, namely node and node. Among them, and are sibling nodes, and the parent node of is node. It should be noted that since the node defines the main body of the document, the node contains all the content of the document (such as text, hyperlinks, images, controls, and lists, etc.). In other words, the node contains all the page elements of the browser. Therefore, the electronic device can globally scan the root node of the browser page to find the target page elements associated with the label attributes.
[0041] Further, after the electronic device obtains each target page element, it may generate a shortcut key required to be configured for each target page element and shortcut key text corresponding to each shortcut key according to a combination key composed of a character key and a function key. Among them, the keys of the keyboard may include character keys and function keys. The function keys may include numeric keys, alphabetic keys, and F1 to F12 keys. The character keys may include other keys except function keys, such as the Alt key, Ctrl key, Enter key, and arrow keys, etc. The electronic device may generate shortcut keys with the same number as the target page elements according to the combination key composed of a character key and a function key, and assign a shortcut key to each target page element. It should be understood that when assigning a shortcut key to each target page element, the shortcut keys may be assigned to each target page element in sequence according to the order of obtaining the target page elements, or the shortcut keys may be randomly assigned to each target page element, which is not limited herein.
[0042] In some feasible embodiments, the electronic device may generate a shortcut key required to be configured for each target page element according to a combination key composed of a character key and a numeric key. See Figure 4, Figure 4 is another schematic diagram of a browser page in a shortcut key configuration method for a program developed based on a browser web page provided by this application. As Figure 4 shown, it is assumed that the "Approval" button, "Transfer for Approval" button, "OK" button, "Cancel" button, hyperlink shown as "http: / / xxx", and image a are all associated with tag attributes. The electronic device can generate shortcut keys required to be configured for each target page element according to the combination keys composed of character keys and numeric keys. For example, when the character key is the target key and the target key is the Alt key, shortcut keys can be generated according to the combination keys composed of the Alt key and numeric keys, such as "Alt+1", "Alt+2", "Alt+3", "Alt+4", "Alt+5", and "Alt+6", and a shortcut key is assigned to each target page element. Exemplarily, as Figure 4 described, the shortcut key configured for the "Approval" button is "Alt+1", the shortcut key configured for the "Transfer for Approval" button is "Alt+2", the shortcut key configured for the "OK" button is "Alt+3", the shortcut key configured for the "Cancel" button is "Alt+4", the shortcut key configured for the hyperlink shown as "http: / / xxx" is "Alt+5", and the shortcut key configured for image a is "Alt+6". It should be understood that the target key can be a character key, or a function key, or a combination key of a character key and a function key, which can be specifically determined according to the actual application scenario and is not limited herein. It should be noted that since each shortcut key can only execute one trigger event when triggering an event through the shortcut key, in order to avoid shortcut key conflicts, the trigger operation of the target key cannot be used as the operation instruction for executing the trigger event corresponding to the target page element.
[0043] Optionally, when the combination of the Alt key and numeric keys is insufficient, shortcut keys can also be generated by adding the combination keys composed of character keys and letter keys on the basis of the Alt key and numeric keys, such as generating shortcut keys according to the Alt key and letter keys, which is not limited herein.
[0044] In some feasible embodiments, the electronic device can also display shortcut key texts in the browser page to prompt the user of the shortcut keys corresponding to each target page element. Exemplarily, as Figure 4As shown, after configuring shortcut keys for each target page element, it is also possible to generate shortcut key texts corresponding to the shortcut keys and display the corresponding shortcut key texts near the target page elements. For example, display the shortcut key text shown as "Alt+1" near the "Approval" button, display the shortcut key text shown as "Alt+2" near the "Transfer for Approval" button, display the shortcut key text shown as "Alt+3" near "OK", display the shortcut key text shown as "Alt+4" near the "Cancel" button, display the shortcut key text shown as "Alt+5" near the hyperlink shown as "http: / / xxx", and display the shortcut key text shown as "Alt+6" near image a.
[0045] Optionally, the electronic device can implement the embedding of the shortcut key text through the div tag. A container element can be added to a part of the HTML file of the browser page, such as Element The element is used to display the shortcut key text. For example, the "Approval" button and the shortcut key "Alt+1" for the "Approval" button pair: Alt+1 Among them, "Alt+1" can represent the text to be embedded, that is, the shortcut key text. It can be seen that through The element can display shortcut text for prompting shortcut keys for each target page element, eliminating the need for users to memorize shortcut keys and improving work efficiency.
[0046] Optionally, the electronic device can dynamically use JavaScript to Text is added or modified to display the updated text in the browser page. Those skilled in the art should be aware of this and will not be elaborated here.
[0047] In some feasible embodiments, the electronic device can adjust text display through CSS styles, such as the font, size, color, etc. of the text, and can also implement mouse hover tips through pseudo-elements (such as after). Among them, a mouse hover tip means that when the mouse hovers over a certain page element, hidden content (such as shortcut key text) can be displayed. Exemplarily, please refer to Figure 5 , Figure 5 is another browser page schematic diagram of a shortcut key configuration method in a program developed based on browser web pages provided by this application. As Figure 5 shown, when the user hovers the mouse pointer over the "Approval" button, the electronic device can display shortcut key text such as "Alt+1" near the "Approval" button.
[0048] In specific implementation, the electronic device can detect mouse events. Among them, mouse events can include click event (click), double-click event (db click), triggered when the mouse button is pressed (mousedown), triggered when the pressed mouse button is released (mouseup), triggered when the mouse pointer moves to a page element (mouseover), triggered when the mouse pointer leaves the page element (mouseout), etc. It can be seen that the electronic device can capture the actions of the user pressing, releasing the mouse button, and moving the mouse pointer. By detecting mouse events, a richer interaction experience can be provided for the user. Specifically, in JavaScript, the onmouseover() and onmouseout() events can be used to achieve the mouse hover effect. When the mouse pointer hovers over a page element, the onmouseover() event will be triggered, and when the mouse pointer leaves the element, the onmouseout() event will be triggered.
[0049] Optionally, in CSS, the electronic device can use the :hover selector to select the target page element over which the mouse pointer floats and set the text style. Or, the mouse hover tip effect can be achieved through the title attribute of HTML, which can be specifically determined according to the actual application scenario and will not be elaborated here.
[0050] It should be understood that there can be various forms of combination keys composed of character keys and function keys. The following will further elaborate on the combination keys composed of character keys and function keys in combination with the accompanying drawings and embodiments. It should be understood that several combination keys provided in the embodiments of this application are only several of the various feasible embodiments and are not used to limit this application.
[0051] In some feasible embodiments, the electronic device can generate shortcut keys for each target page element according to the combination keys composed of character keys and letter keys. Refer to Figure 6 , Figure 6 which is another browser page schematic diagram of a shortcut key configuration method in a program developed based on browser web pages provided by this application. As Figure 6 shown, assuming that the "Approval" button, "Transfer for Review" button, "OK" button, "Cancel" button, the hyperlink shown as "http: / / xxx", and the image a are all associated with label attributes, the electronic device can generate shortcut keys for each target page element according to the combination keys composed of character keys and letter keys. For example, when the character key is the target key and the target key is the Alt key, the shortcut keys can be generated according to the combination keys of the Alt key and letter keys, such as "Alt+a", "Alt+b", "Alt+c", "Alt+d", "Alt+e", and "Alt+f", and assign a shortcut key to each target page element. Exemplarily, as Figure 6 described, the shortcut key configured for the "Approval" button is "Alt+a", the shortcut key configured for the "Transfer for Review" button is "Alt+b", the shortcut key configured for the "OK" button is "Alt+c", the shortcut key configured for the "Cancel" button is "Alt+d", the shortcut key configured for the hyperlink shown as "http: / / xxx" is "Alt+e", and the shortcut key configured for the image a is "Alt+f".
[0052] Optionally, when the combination of the Alt key and letter keys is insufficient, the electronic device can also generate shortcut keys by adding the combination keys composed of character keys and numeric keys on the basis of the Alt key and letter keys, such as generating shortcut keys according to the Alt key and numeric keys, which is not limited herein.
[0053] Among them, the above-mentioned character keys can also be the "Ctrl" key, "Shift" key, "Tab" key, "Enter" key, and arrow keys, etc. Among them, the above-mentioned arrow keys, such as the "→" right arrow key, "↓" down arrow key, "↑" up arrow key, "←" left arrow key, the above-mentioned function keys can also be the F1 key to F2 key, and the combination keys composed of the above-mentioned character keys and function keys can be the combination keys of the character keys and numeric keys, letter keys, F1 key to F2 key, etc., which can be specifically determined according to the actual application scenario and are not limited herein. In other feasible real-time modes, the combination keys composed of character keys and multiple function keys can also be used to generate shortcut keys, such as "Alt+1+a", or, the combination keys composed of multiple character keys and function keys can be used to generate shortcut keys, such as "Ctrl+Alt+1", or, the combination keys composed of multiple character keys and multiple function keys can be used to generate shortcut keys, such as "Ctrl+Alt+1+a", which can be specifically determined according to the actual application scenario and are not limited herein.
[0054] Furthermore, the electronic device can also display shortcut key texts in the browser page to prompt the user of the shortcut keys corresponding to each target page element. Exemplarily, as Figure 6 shown, after configuring the shortcut keys for each target page element, the electronic device can also generate the shortcut key texts corresponding to the shortcut keys and display the corresponding shortcut key texts near the target page elements. For example, the shortcut key text such as "Alt+a" is displayed near the "Approval" button, the shortcut key text such as "Alt+b" is displayed near the "Transfer for Approval" button, the shortcut key text such as "Alt+c" is displayed near the "OK" button, the shortcut key text such as "Alt+d" is displayed near the "Cancel" button, the shortcut key text such as "Alt+e" is displayed near the hyperlink such as "http: / / xxx", and the shortcut key text such as "Alt+f" is displayed near the image a. The specific process of displaying the shortcut key texts in the browser page can be referred to Figure 4 the corresponding embodiments and will not be elaborated here.
[0055] It should be understood that when there are many page elements in the browser page and to ensure that the shortcut keys do not conflict, the shortcut keys can be generated according to the combination keys composed of character keys and letter keys, which can basically meet the vast majority of situations where shortcut keys are needed. However, in the actual operation process, the shortcut keys generated by the combination keys require the user to press at least two keyboard keys when triggered, and the operation may be interrupted. For example, when the shortcut key is "Ctrl+Alt+1", it may be interrupted after pressing the "Ctrl+Alt" keys, so that the electronic device cannot detect the keyboard event of "Ctrl+Alt+1", and thus cannot execute the trigger event corresponding to "Ctrl+Alt+1", resulting in a decrease in the user's work efficiency.
[0056] Therefore, when there are few page elements in the browser page and the shortcut keys do not conflict, the shortcut keys can be generated according to character keys or function keys. In some feasible embodiments, the electronic device can generate the shortcut keys required to be configured for each target page element according to character keys. It should be understood that when generating the shortcut keys for the target page elements according to a single character key, since each shortcut key can only execute one event to avoid shortcut key conflicts, the target key cannot be used as the shortcut key for the target page element. For example, when the target key is the character key "Alt", in order to avoid shortcut key conflicts, the "Alt" key cannot be used to generate the shortcut keys when generating the shortcut keys required to be configured for each target page element according to character keys. Exemplarily, please refer to Figure 7 , Figure 7 which is another schematic diagram of the browser page in a shortcut key configuration method for a program developed based on browser web pages provided by this application. As Figure 7 As shown, the electronic device can generate shortcut keys required for each target page element according to character keys. For example, when the target key is the Alt key, the electronic device can generate shortcut keys consistent with the number of target page elements according to character keys, such as the "Ctrl" key, the "Shift" key, and the "Enter" key. In other feasible embodiments, when there are not enough character keys, the electronic device can also use function keys to generate shortcut keys, such as numeric keys, and then assign a shortcut key to each target page element. Further, the electronic device can also display shortcut key text in the browser page to prompt the user of the shortcut key corresponding to each target page element. Among them, the specific process of displaying the shortcut key text in the browser page can be referred to Figure 4 the corresponding embodiment, which will not be elaborated here. Exemplarily, as Figure 7 shown, after configuring shortcut keys for each target page element, the electronic device can also generate shortcut key text corresponding to the shortcut keys and display the corresponding shortcut key text near the target page element. For example, display shortcut key text such as "Ctrl" near the "Approval" button, display shortcut key text such as "Shift" near the "Transfer for Approval" button, display shortcut key text such as "Enter" near the "OK", display shortcut key text such as "1" near the "Cancel" button, display shortcut key text such as "2" near the hyperlink such as "http: / / xxx", and display shortcut key text such as "3" near image a.
[0057] In some feasible embodiments, the electronic device can generate shortcut keys required for each target page element according to function keys. Among them, the function keys can be letter keys or numeric keys. Please refer to Figure 8 and Figure 9 , Figure 8 and Figure 9 which are another schematic diagram of a browser page in a shortcut key configuration method for a program developed based on browser web pages provided by this application. As Figure 8 shown, the electronic device can generate shortcut keys for each target page element according to letter keys and generate shortcut key text corresponding to each shortcut key. For example, display shortcut key text such as "a" near the "Approval" button, display shortcut key text such as "b" near the "Transfer for Approval" button, display shortcut key text such as "c" near the "OK", display shortcut key text such as "d" near the "Cancel" button, display shortcut key text such as "e" near the hyperlink such as "http: / / xxx", and display shortcut key text such as "f" near image a. It should be understood that when there are not enough letter keys, the electronic device can also generate shortcut keys according to numeric keys on the premise of ensuring that the shortcut keys do not conflict. Similarly, as Figure 9 As shown, shortcut keys can be generated for each target page element according to the numeric keys, and the shortcut key text corresponding to each shortcut key can be generated. For example, the shortcut key text shown as "1" is displayed near the "Approval" button, the shortcut key text shown as "2" is displayed near the "Transfer for Approval" button, the shortcut key text shown as "3" is displayed near "OK", the shortcut key text shown as "4" is displayed near the "Cancel" button, the shortcut key text shown as "5" is displayed near the hyperlink shown as "http: / / xxx", and the shortcut key text shown as "6" is displayed near image a. It should be understood that when the numeric keys are insufficient, shortcut keys can also be generated according to the alphabet keys while ensuring that the shortcut keys do not conflict.
[0058] In some feasible embodiments, the electronic device can generate the shortcut keys required to be configured for each target page element according to multiple function keys or multiple character keys. For example, double-click the "Alt" key, double-click the "a" key, etc.
[0059] In some feasible embodiments, please refer to Figure 10 , Figure 10 is another browser page schematic diagram of the shortcut key configuration method in a program developed based on browser web pages provided by this application. As Figure 10 shown, the electronic device can display a virtual keyboard in the browser page, and the user can trigger the shortcut key by directly selecting (such as clicking) the virtual button. This way can make the keyboard configuration more intuitive and simplified, and enable the user to quickly configure and trigger the shortcut key. It should be understood that the virtual keyboard corresponds to the physical keyboard, that is, the triggering operation on the target button in S101 above can be the selection operation on the corresponding button on the physical keyboard (such as keyboard 30), or the triggering operation on the corresponding button on the virtual keyboard. For example, when the target button is the Alt key, the user can trigger the Alt key on the physical keyboard or trigger the Alt key on the virtual keyboard, and this application does not make any restrictions here.
[0060] It should be noted that for the shortcut key configuration method in the program developed based on browser web pages provided by this application, after obtaining the target page elements in the browser page, the shortcut keys are configured for the target page elements according to the preset rules, and the shortcut key text corresponding to the shortcut keys is displayed in the browser page. This way of obtaining the target page elements first and then configuring the shortcut keys is also applicable to other browser pages. Please refer to Figure 11 , Figure 11 is another browser page schematic diagram of the shortcut key configuration method in a program developed based on browser web pages provided by this application. The electronic device can display as Figure 11 The browser page shown may include text buttons or icon buttons displaying the words "Submit", "Save", and "Cancel", text such as "Name:", "Email:", input boxes corresponding to the "Name:" and "Email:" text respectively, and a title such as "Application Form". Among them, when the user needs to submit the application form, they can click the "Submit" button, and the electronic device can respond to the click operation on the "Submit" button to submit the application form. When the user needs to save the application form, they can click the "Save" button, and the electronic device can respond to the click operation on the "Save" button to save the application form. When the user needs to close the application form, they can click the "Cancel" button, and the electronic device can respond to the click operation on the "Cancel" button to close the application form. When the user needs to fill in their name, they can click the input box corresponding to the "Name:" text to enter their name, and the electronic device can respond to the click operation on the input box corresponding to the "Name:" text to select the input box corresponding to the "Name:" text. When the user needs to fill in their email, they can click the input box corresponding to the "Email:" text to enter their email, and the electronic device can respond to the click operation on the input box corresponding to the "Email:" text to select the input box corresponding to the "Email:" text.
[0061] Further, the electronic device can respond to the trigger operation of the target key, obtain each target page element from at least one page element based on the tag attribute, generate shortcut key text corresponding to the shortcut keys that need to be configured for each target page element according to the preset rules, and display each shortcut key text on the browser page. The electronic device can find the target page element from the browser page shown as Figure 11 Assume that the "Submit" button, "Save" button, "Cancel" button, and the input boxes corresponding to the "Name:" and "Email:" text are all associated with tag attributes. Further, the electronic device can generate the shortcut keys that need to be configured for each target page element and the corresponding shortcut key text according to the combination keys composed of character keys and numeric keys. As Figure 11 shown, display the shortcut key text such as "Alt+1" near the "Submit" button, the shortcut key text such as "Alt+2" near the "Save" button, the shortcut key text such as "Alt+3" near "Cancel", the shortcut key text such as "Alt+4" near the input box corresponding to the "Name:" text, and the shortcut key text such as "Alt+5" near the input box corresponding to the "Email:" text.
[0062] Among them, the browser page shown as Figure 11 is the same as Figure 4 Compared with the browser page shown, the content and buttons in the browser page are different. However, since the preset rules are the same, that is, the shortcut keys required for each target page element are generated according to the combination keys composed of character keys and numeric keys, there is a situation where the same shortcut key corresponds to different target page elements. It can be seen that the shortcut keys output by the shortcut key configuration method in the program based on browser web development provided in this application are temporary shortcut keys. When the browser page changes, the shortcut keys may not change.
[0063] It can be understood that, for example, an electronic device can find the target page elements that need to configure shortcut keys from the page elements of the browser through tag attributes, and then generate the shortcut keys for each target page element and the shortcut key text corresponding to the shortcut keys, and display each shortcut key text in the browser page. It can be seen that the shortcut keys and the shortcut key text are generated for the browser page, that is, the shortcut keys and the shortcut key text are generated for the target page elements in the current browser page, and in each browser page, when the preset rules are the same, the shortcut keys generated according to the preset rules are also the same. In other words, when the browser page is updated, or when entering another browser page, the target page elements may change, but since the preset rules are the same, there may be a situation where the same shortcut key executes different trigger events in different browser pages. To sum up, the shortcut key configuration method in the program based on browser web development provided in this application does not require developers to define and configure shortcut keys during the development stage, nor does it require maintaining the shortcut keys, which can effectively reduce the maintenance cost. In addition, by displaying the shortcut key text in the browser page, users do not need to memorize the shortcut keys, which can effectively improve the work efficiency of users, greatly reduce the operation threshold and the probability of errors, and also improve the flexibility and efficiency of configuring shortcut keys by configuring temporary shortcut keys for the target page elements in the browser page according to the preset rules.
[0064] In some feasible implementation manners, the electronic device can obtain the trigger events of each target page element, and generate the corresponding relationship between each shortcut key and each trigger event, where the corresponding relationship is used to indicate that when the shortcut key is triggered, the corresponding trigger event is executed, and the target page element includes at least one of a control, a multimedia, a form, a text, or a hyperlink.
[0065] In a specific implementation, the electronic device can view the events bound to the target page element through JavaScript. For example, the electronic device can return an object of the target page element through getEventListeners, and this object contains all the trigger events bound to the target page element. Or, use the jQuery library and view the trigger events bound to the target page element through the $.data method. Or, view the attributes of the target page element (such as onclick, onmouseover) in the DOM tree structure, etc., to obtain the trigger events bound to the target page element. It should be understood that the present application does not limit the manner of obtaining the trigger events of each target page element. Further, each shortcut key is bound to each trigger event to generate the corresponding relationship between each shortcut key and each trigger event. It should be understood that in the process of generating the corresponding relationship between each shortcut key and each trigger event, it is necessary to bind the shortcut key configured for the target page element to the trigger event corresponding to the target page element to avoid the situation of shortcut key conflicts caused by the reuse of shortcut keys, and ensure that when the shortcut key configured for the target page element is triggered, the trigger event corresponding to the target page element is executed.
[0066] In some feasible implementation manners, when the electronic device detects that the target shortcut key in each shortcut key is triggered, it can execute the trigger event corresponding to the target shortcut key according to the corresponding relationship.
[0067] Specifically, please refer to Figure 12 , Figure 12 which is another browser page schematic diagram of a shortcut key configuration method in a program developed based on browser web pages provided by the present application. For example, "Alt+1" is the target shortcut key. When the user triggers "Alt+1", the electronic device detects the keyboard event that "Alt+1" is triggered and can execute the trigger event corresponding to "Alt+1", that is, submit for approval, and display a prompt message containing "submission successful" as shown in Figure 12 . Optionally, the triggering of the above target shortcut key can be a triggering operation on the corresponding key of a physical keyboard (such as the keyboard 30 shown in Figure 1 ), or a triggering operation on the corresponding key of a virtual keyboard (such as the virtual keyboard shown in Figure 10 ), and the present application does not limit this here.
[0068] It can be seen that by configuring shortcut keys for the target page element, compared with triggering by using a mouse click, the operation can be completed more quickly, saving time and labor costs, and improving work efficiency. In addition, using shortcut keys in a browser page with a more complex operation can simplify the operation process, enabling users to complete complex operations through simple key combinations, which not only improves the operation convenience but also enriches the user's interaction experience.
[0069] In some feasible embodiments, the electronic device can respond to a screen clearing operation for shortcut key texts, cancel the display of each shortcut key text in the browser page, and destroy the correspondence between each shortcut key and each trigger event; the screen clearing operation for shortcut key texts includes a second trigger operation of a target key.
[0070] In a specific implementation, when the electronic device detects the second trigger operation of the target key, or detects a browser page update (such as entering from the browser page shown in Figure 4 to the browser page shown in Figure 11 ), the electronic device can respond to the screen clearing operation for shortcut key texts, cancel the display of each shortcut key text, and destroy the correspondence between each shortcut key and each trigger event. It should be understood that the shortcut keys and the correspondence between the shortcut keys and the trigger events are only for the current browser page. When the browser page is updated, the original shortcut keys and the corresponding relationships are destroyed. Therefore, the maintenance cost of the shortcut keys can be effectively reduced, and users do not need to remember the shortcut keys, which can effectively improve work efficiency.
[0071] In some feasible embodiments, the electronic device can generate event texts corresponding to each trigger event based on the trigger events of each target page element, and add each event text to the corresponding container element to display each event text in the browser page.
[0072] Specifically, after the electronic device obtains the trigger events of each target page element, it can obtain a description related to the trigger event corresponding to the target page element according to the attribute information carried by the target page element, and then generate event texts corresponding to each trigger event. For example, the trigger event corresponding to the "Approval" button is to submit for approval, then the event text generated by this trigger event can be "Submit for approval", the trigger event corresponding to the "Transfer for Approval" button is to submit for approval to others, then the event text generated by this trigger event can be "Transfer to xxx", the trigger event corresponding to the "OK" button is to save the content in the current page, then the event text generated by this trigger event can be "OK to save", the trigger event corresponding to the "Cancel" button is to cancel the approval, then the event text generated by this trigger event can be "Cancel approval", the trigger event corresponding to the hyperlink shown in "http: / / xxx" is to jump to the browser page indicated by the hyperlink, then the event text generated by this trigger event can be "Jump to page", and the trigger event corresponding to image a is to select the image, then the event text generated by this trigger event can be "Select image". Further, the electronic device can implement the embedding of the event text through the div tag. For specific examples, please refer to Figure 4 For the embodiments, no more details will be elaborated here. Please refer to Figure 13 , Figure 13 Another schematic diagram of a browser page in a shortcut key configuration method for a program developed based on a browser web page provided by this application. As Figure 13 shown, the electronic device can display event text such as "Submit for approval" near the "Approval" button, event text such as "Transfer to xxx" near the "Transfer for approval" button, event text such as "Confirm save" near the "OK" button, event text such as "Cancel approval" near the "Cancel" button, event text such as "Jump to page" near the hyperlink shown as "http: / / xxx", and event text such as "Select image" near image a. In some feasible implementation manners, the above-mentioned event texts can also be displayed through mouse hover prompts. For example, when the user hovers the mouse pointer over the "Approval" button, the electronic device can display event text such as "Submit for approval" near the "Approval" button. Among them, the configuration of mouse hover prompts for event texts is similar to the configuration of mouse hover prompts for shortcut key texts, and will not be elaborated here.
[0073] Optionally, the electronic device can generate a prompt message based on the shortcut key text and event text corresponding to each target page element, and add each prompt message to the corresponding container element to display each prompt message in the browser page. Please refer to Figure 14 , Figure 14 Another schematic diagram of a browser page in a shortcut key configuration method for a program developed based on a browser web page provided by this application. As Figure 14 shown, the electronic device can display a prompt message such as "Alt+1: Submit for approval" near the "Approval" button, a prompt message such as "Alt+2: Transfer to xxx" near the "Transfer for approval" button, a prompt message such as "Alt+3: Confirm save" near the "OK" button, a prompt message such as "Alt+4: Cancel approval" near the "Cancel" button, a prompt message such as "Alt+5: Jump to page" near the hyperlink shown as "http: / / xxx", and a prompt message such as "Alt+6: Select image" near image a.
[0074] It can be seen that by displaying the shortcut key text and event text in the browser page, relevant information of each target page element can be clearly provided to the user, improving the visual effect of the prompt, facilitating the user to understand the functions of the target page elements, and improving the user experience.
[0075] Based on the same inventive concept, embodiments of the present disclosure also provide a shortcut key configuration device in a program developed based on a browser web page, as described in the following embodiments. Since the principle of solving problems in the device embodiments is similar to that of the above method embodiments, the implementation of the device embodiments can refer to the implementation of the above method embodiments, and repeated parts will not be elaborated. It should be understood that the above device may be a computer program (including program code) running on an electronic device, and the device may be used to execute the corresponding steps in the shortcut key configuration method in the program developed based on the browser web page provided in the embodiments of the present application; the device may be applied to Figure 1 the electronic device 20 shown in
[0076] See Figure 15 , Figure 15 which is a schematic diagram of a shortcut key configuration device in a program developed based on a browser web page provided by the present application. As Figure 15 shown, the device (hereinafter referred to as device 50) of the shortcut key configuration device in the program developed based on the browser web page includes: a display module 501 and a processing module 502.
[0077] Among them, the display module 501 is used to display a browser page, and the browser page is composed of at least one page element, and at least one of the at least one page element includes at least one target page element associated with a label attribute.
[0078] The processing module 502 is configured to, in response to a trigger operation of a target key, obtain each target page element from at least one page element based on the label attribute, generate a shortcut key text corresponding to the shortcut key to be configured for each target page element according to a preset rule, and display each shortcut key text in the browser page.
[0079] According to the above Figure 2 corresponding embodiments, Figure 2 the implementation manners described in steps S101 to S102 in the shortcut key configuration method in the program developed based on the browser web page shown in Figure 15 can be executed by each module of the device 50 shown in Figure 2 . For example, the implementation manner described in step S101 in the shortcut key configuration method in the program developed based on the browser web page shown in Figure 2 can be executed by the display module 501, and the implementation manner described in step S102 can be executed by the processing module 502. Among them, the implementation manners executed by the above display module 501 and processing module 502 can refer to the implementation manners provided in each step in the above Figure 2 corresponding embodiments, and will not be elaborated here.
[0080] In the embodiments of the present application, the functional implementation of each unit in the shortcut key configuration device in a program developed based on a browser web page can improve the user's perception efficiency of shortcut keys, enrich the interaction mode between the browser page and the user, and enhance the visualization effect of the interaction.
[0081] In some feasible embodiments, the above device 50 further includes: A service processing module 503, configured to obtain the trigger events of each target page element, and generate the correspondence between each shortcut key and each trigger event, where the correspondence is used to indicate that when the shortcut key is triggered, the corresponding trigger event is executed; Wherein, the target page element includes at least one of a control, a multimedia, a form, a text, or a hyperlink.
[0082] In some feasible embodiments, the above service processing module 503 is further configured to, when detecting that a target shortcut key in each shortcut key is triggered, execute the trigger event corresponding to the target shortcut key according to the correspondence.
[0083] In some feasible embodiments, the above processing module 502 includes: A first processing unit 5020, configured to generate the shortcut keys that each target page element needs to configure and the shortcut key texts corresponding to each shortcut key based on the combination keys composed of character keys and function keys; the character key is the target key, and the function key is a numeric key or an alphabetic key; A second processing unit 5021, configured to create container elements corresponding to each target page element at the root node of the browser page, and add each shortcut key text to the corresponding container element, so as to display each shortcut key text in the browser page.
[0084] In some feasible embodiments, the above display module 501 is further configured to, in response to a screen clearing operation on the shortcut key text, cancel the display of each shortcut key text in the browser page, and destroy the correspondence between each shortcut key and each trigger event; the screen clearing operation on the shortcut key text includes the second trigger operation of the target key.
[0085] In some feasible embodiments, the above second processing unit 5021 is further configured to generate event texts corresponding to each trigger event based on the trigger events of each target page element, and add each event text to the corresponding container element, so as to display each event text in the browser page.
[0086] It should be noted here that the examples and application scenarios implemented by the above modules and the corresponding steps are the same, but are not limited to the content disclosed in the above method embodiments. It should be noted that the above modules, as part of the device, can be executed in a computer system such as a set of computer executable instructions.
[0087] In the embodiments of the present application, the above-mentioned Figure 15 each module in the device 50 shown can be separately or wholly combined into one or several other modules to form, or a certain one (or some) of the modules can be further split into multiple smaller modules in terms of function to form, which can achieve the same operation without affecting the realization of the technical effects of the embodiments of the present application. The above modules are divided based on logical functions. In practical applications, the function of one module can also be realized by multiple modules, or the functions of multiple modules can be realized by one module. In other feasible implementation manners of the present application, the above-mentioned device 50 may also include other modules. In practical applications, these functions can also be assisted by other modules and can be realized by the cooperation of multiple modules, which is not limited herein.
[0088] Please refer to Figure 16 , Figure 16 which is a schematic structural diagram of an electronic device provided by the embodiments of the present application. As Figure 16 shown, the electronic device 60 may include: at least one processor 600, at least one memory 601, a display screen 602, and at least one input / output device 603. The electronic device 60 may also include at least one communication bus 604, at least one network interface 605, and at least one transceiver 606. Among them, the communication bus 604 is used to realize the connection and communication between these components. The above-mentioned processor 600, at least one memory 601, the display screen 602, and at least one input / output device 603 can complete the communication with each other through the communication bus 604. The communication bus 604 mentioned here may be a Peripheral Component Interconnect (PCI) bus or an Extended Industry Standard Architecture (EISA) bus, etc. The communication bus 604 can be divided into an address bus, a data bus, a control bus, etc.
[0089] Among them, the processor 600 is used to execute a computer program, and the computer program can adopt instruction sets of architectures such as x86, Arm, RISC, MIPS, SSE, etc. The above-mentioned processor 600 can be a general-purpose processor, including a central processing unit (CPU for short), a network processor (NP for short), etc.; it can also be a digital signal processor (DSP for short), an application specific integrated circuit (ASIC for short), a field programmable gate array (FPGA for short), or other programmable logic devices, discrete gate or transistor logic devices, discrete hardware components.
[0090] Among them, the memory 601 can include a random access memory (RAM), and can also include a non-volatile memory (NVM), such as at least one disk memory. Optionally, the memory 601 can also be at least one storage device located far from the aforementioned processor 600.
[0091] Among them, the display screen 602 can include a display screen (Display), and the display screen can be a touch display screen. The input / output device 603 can include a keyboard (Keyboard), a mouse, etc., and can also include a touch device. Among them, the network interface 605 can include a standard wired interface (such as a USB interface or a headphone interface, etc.), a wireless interface (such as a WI-FI interface).
[0092] As Figure 16 shown, the memory 601 as a computer storage medium can include an operating system 6010, a network communication module 6011, a user interface module 6012, and a device control application program 6013.
[0093] In Figure 16 the electronic device 60 shown, the network interface 605 can provide network communication functions; and the transceiver 606 and the processor 600 can be used to call the device control application program stored in the memory 601 to be applied to Figure 1 the electronic device 20 shown to achieve: display a browser page, the browser page is composed of at least one page element, and at least one target page element associated with a label attribute is included in the at least one page element; In response to a triggering operation of a target key, each target page element is obtained from the at least one page element based on the label attribute, and a shortcut key text corresponding to the shortcut key to be configured for each target page element is generated according to a preset rule, and each shortcut key text is displayed in the browser page.
[0094] It should be understood that the electronic device 60 described in the embodiments of the present application can execute the description of the shortcut key configuration method in the program developed based on the browser web page in the corresponding embodiments mentioned above, and can also execute the description of the shortcut key configuration device in the program developed based on the browser web page in the corresponding embodiments mentioned above, which will not be elaborated here. In addition, the description of the beneficial effects of adopting the same method will not be elaborated either. Figure 2 It should be understood that the electronic device 60 described in the embodiments of the present application can execute the description of the shortcut key configuration method in the program developed based on the browser web page in the corresponding embodiments mentioned above, and can also execute the description of the shortcut key configuration device in the program developed based on the browser web page in the corresponding embodiments mentioned above, which will not be elaborated here. In addition, the description of the beneficial effects of adopting the same method will not be elaborated either. Figure 15 It should be understood that the electronic device 60 described in the embodiments of the present application can execute the description of the shortcut key configuration method in the program developed based on the browser web page in the corresponding embodiments mentioned above, and can also execute the description of the shortcut key configuration device in the program developed based on the browser web page in the corresponding embodiments mentioned above, which will not be elaborated here. In addition, the description of the beneficial effects of adopting the same method will not be elaborated either.
[0095] In addition, it should be pointed out here that: the embodiments of the present application also provide a computer-readable storage medium, and the computer-readable storage medium stores the computer program executed by the splash screen display device mentioned above. When the processor executes the computer program, it can execute the description of the shortcut key configuration method in the program developed based on the browser web page in the corresponding embodiments mentioned above. Therefore, it will not be elaborated here. In addition, the description of the beneficial effects of adopting the same method will not be elaborated either. Figure 2 In addition, it should be pointed out here that: the embodiments of the present application also provide a computer-readable storage medium, and the computer-readable storage medium stores the computer program executed by the splash screen display device mentioned above. When the processor executes the computer program, it can execute the description of the shortcut key configuration method in the program developed based on the browser web page in the corresponding embodiments mentioned above. Therefore, it will not be elaborated here. In addition, the description of the beneficial effects of adopting the same method will not be elaborated either.
[0096] Among them, more specific examples of the computer-readable storage medium may include, but are not limited to: an electrical connection having 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.
[0097] For the technical details not disclosed in the embodiments of the computer-readable storage medium involved in the present application, please refer to the description of the method embodiments of the present application. As an example, the computer program can be deployed to be executed on an electronic device, or on multiple electronic devices located at one location, or on multiple electronic devices distributed at multiple locations and interconnected through a communication network. The multiple electronic devices distributed at multiple locations and interconnected through a communication network can form a communication system.
[0098] In addition, it should be noted that: the embodiments of the present application also provide a computer program product, which may include a computer program, and the computer program can be stored in a computer-readable storage medium. The processor of the electronic device reads the computer program from the computer-readable storage medium, and the processor can execute the computer program, so that the electronic device can execute the above-mentioned Figure 2 The description of the shortcut key configuration method in the program developed based on browser web pages in the corresponding embodiment will not be elaborated here. In addition, the description of the beneficial effects of adopting the same method will not be elaborated either. For the technical details not disclosed in the embodiments of the computer program product involved in this application, please refer to the description of the method embodiments of this application.
[0099] Those of ordinary skill in the art can understand that all or part of the processes of implementing the methods in the above embodiments can be completed by instructing relevant hardware through a computer program. The computer program can be stored in a computer-readable storage medium. When the program is executed, it can include the processes of the embodiments of the above methods. Among them, the storage medium can be a magnetic disk, an optical disk, a read-only memory (ROM), or a random access memory (RAM), etc.
[0100] The terms "first", "second", etc. in the specification, claims, and drawings of the embodiments of this application are used to distinguish different objects, rather than to describe a specific order. In addition, the term "comprising" and any variations thereof are intended to cover non-exclusive inclusion. For example, a process, method, device, product, or equipment that includes a series of steps or units is not limited to the listed steps or modules, but optionally further includes steps or modules not listed, or optionally further includes other step units inherent to these processes, methods, devices, products, or equipment.
[0101] Those of ordinary skill in the art can realize that the units and algorithm steps of each example described in combination with the embodiments disclosed in this document can be implemented by electronic hardware, computer software, or a combination of both. To clearly illustrate the interchangeability of hardware and software, the composition and steps of each example have been generally described according to functions in the above description. Whether these functions are executed in a hardware or software manner depends on the specific application and design constraints of the technical solution. Professional technicians can use different methods to implement the described functions for each specific application, but such implementation should not be considered to exceed the scope of this application.
[0102] The methods and related devices provided in the embodiments of this application are described with reference to the method flowcharts and / or structural schematic diagrams provided in the embodiments of this application. Specifically, they can be implemented by a computer program for each process and / or block of the method flowchart and / or structural schematic diagram, and the combination of the processes and / or blocks in the flowchart and / or block diagram. These computer program instructions can be provided to the processor of a general-purpose computer, a special-purpose computer, an embedded processor, or other programmable data processing devices to generate a machine, so that the instructions executed by the processor of the computer or other programmable data processing devices generate for implementation in the process Figure 1 Diagram of one or more processes and / or structures Figure 1 Apparatus for the functions specified in one or more boxes. These computer program instructions can also be stored in a computer-readable memory that can direct a computer or other programmable data processing device to work in a specific manner, such that the instructions stored in the computer-readable memory produce a manufacture including an instruction apparatus that implements the processes Figure 1 Diagram of one or more processes and / or structures Figure 1 Apparatus for the functions specified in one or more boxes. These computer program instructions can also be loaded onto a computer or other programmable data processing device, such that a series of operational steps are executed on the computer or other programmable device to produce a computer-implemented process, and thus the instructions executed on the computer or other programmable device provide for implementing the processes Figure 1 Steps for the functions specified in one or more boxes of one or more processes and / or structures
[0103] The foregoing disclosure is only for the preferred embodiments of the present application. Of course, it cannot be used to limit the scope of rights of the present application. Therefore, equivalent changes made according to the claims of the present application still fall within the scope covered by the present application.
Claims
1. A method for configuring shortcut keys in a program developed based on browser web pages, characterized in that, The method includes: Displaying a browser page, where the browser page consists of at least one page element, and at least one of the at least one page element includes at least one target page element associated with a tag attribute; In response to a trigger operation of a target key, obtaining each of the target page elements from the at least one page element based on the tag attribute, generating shortcut key texts corresponding to the shortcut keys to be configured for each of the target page elements according to a preset rule, and displaying each of the shortcut key texts in the browser page.
2. The method according to claim 1, characterized in that, The method further includes: Obtaining a trigger event of each of the target page elements, and generating a correspondence between each of the shortcut keys and each of the trigger events, where the correspondence is used to indicate that when the shortcut key is triggered, the corresponding trigger event is executed, and the target page element includes at least one of a control, a multimedia, a form, a text, or a hyperlink.
3. The method according to claim 2, characterized in that, The method further includes: When it is detected that a target shortcut key in each of the shortcut keys is triggered, executing the trigger event corresponding to the target shortcut key according to the correspondence.
4. The method according to claim 2, characterized in that The generating shortcut key texts corresponding to the shortcut keys to be configured for each of the target page elements according to a preset rule and displaying each of the shortcut key texts in the browser page includes: Generating shortcut keys to be configured for each of the target page elements and shortcut key texts corresponding to each of the shortcut keys based on a combination key composed of a character key and a function key; the character key is the target key, and the function key is a numeric key or an alphabetic key; Creating a container element corresponding to each of the target page elements at the root node of the browser page, and adding each of the shortcut key texts to the corresponding container element to display each of the shortcut key texts in the browser page.
5. The method according to claim 4, characterized in that, The method further includes: In response to a screen clearing operation on the shortcut key text, canceling the display of each of the shortcut key texts in the browser page and destroying the correspondence between each of the shortcut keys and each of the trigger events; the screen clearing operation on the shortcut key text includes a second trigger operation of the target key.
6. The method according to claim 4, characterized in that, The method further includes: Generating an event text corresponding to each of the trigger events based on the trigger event of each of the target page elements, and adding each of the event texts to the corresponding container element to display each of the event texts in the browser page.
7. A shortcut key configuration device in a program developed based on browser web pages, characterized in that, The device includes: A display module for displaying a browser page, where the browser page consists of at least one page element, and at least one of the at least one page element includes at least one target page element associated with a tag attribute; A processing module for, in response to a trigger operation of a target key, obtaining each of the target page elements from the at least one page element based on the tag attribute, generating shortcut key texts corresponding to the shortcut keys to be configured for each of the target page elements according to a preset rule, and displaying each of the shortcut key texts in the browser page.
8. The device according to claim 7, characterized in that, The device further includes: A service processing module, configured to obtain a trigger event of each of the target page elements, and generate a correspondence between each of the shortcut keys and each of the trigger events, where the correspondence is used to indicate that when the shortcut key is triggered, the corresponding trigger event is executed; Wherein, the target page elements include at least one of a control, multimedia, a form, text, or a hyperlink.
9. The device according to claim 8, wherein The service processing module is further configured to, when detecting that a target shortcut key in each of the shortcut keys is triggered, execute a trigger event corresponding to the target shortcut key according to the correspondence.
10. The device according to claim 8, characterized in that, The processing module includes: A first processing unit, configured to generate a shortcut key that each of the target page elements needs to be configured with and a shortcut key text corresponding to each of the shortcut keys based on a combination key composed of a character key and a function key; the character key is the target key, and the function key is a numeric key or a letter key; A second processing unit, configured to create a container element corresponding to each of the target page elements at a root node of the browser page, and add each of the shortcut key texts to each of the corresponding container elements, so as to display each of the shortcut key texts in the browser page.
11. The device according to claim 10, characterized in that, The display module is further configured to, in response to a screen clearing operation on the shortcut key text, cancel the display of each of the shortcut key texts in the browser page, and destroy the correspondence between each of the shortcut keys and each of the trigger events; the screen clearing operation on the shortcut key text includes a second trigger operation of the target key.
12. The device according to claim 10, wherein The second processing unit is further configured to generate an event text corresponding to each of the trigger events based on the trigger event of each of the target page elements, and add each of the event texts to each of the corresponding container elements, so as to display each of the event texts in the browser page.
13. An electronic device, characterized in that, The electronic device includes: a display screen, an input / output device, a memory, and a processor; The memory is configured to store program code; The display screen, the input / output device, and the processor are configured to call the program code to execute the method according to any one of claims 1 to 6.
14. A computer-readable storage medium, characterized in that, Program instructions are stored on the computer-readable storage medium, and when the program instructions are executed by an electronic device, the method according to any one of claims 1 to 6 is implemented.
15. A computer program product, characterized in that, When the computer program product runs on an electronic device, the electronic device is caused to execute the method according to any one of claims 1 to 6.
Citation Information
Patent Citations
Dynamic annotation method based on browser webpage elements
CN105824925A
Method and system for setting shortcut keys
CN107562482A
Full-keyboard browser operation method and device, equipment and storage medium
CN114579903A
Keyboard accelerator
US20070002026A1