CN117235397B - Form data input method, device and medium - Google Patents
Form data input method, device and medium Download PDFInfo
- Publication number
- CN117235397B CN117235397B CN202311517221.1A CN202311517221A CN117235397B CN 117235397 B CN117235397 B CN 117235397B CN 202311517221 A CN202311517221 A CN 202311517221A CN 117235397 B CN117235397 B CN 117235397B
- Authority
- CN
- China
- Prior art keywords
- data
- drop
- option
- user
- down option
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Active
Links
- 238000000034 method Methods 0.000 title claims abstract description 57
- 238000004590 computer program Methods 0.000 claims description 12
- 230000008569 process Effects 0.000 claims description 9
- 238000009877 rendering Methods 0.000 claims description 7
- 230000014509 gene expression Effects 0.000 claims description 5
- 230000001419 dependent effect Effects 0.000 claims description 4
- 230000004044 response Effects 0.000 abstract description 9
- 230000003993 interaction Effects 0.000 description 6
- 238000010586 diagram Methods 0.000 description 4
- 230000009471 action Effects 0.000 description 3
- 238000013473 artificial intelligence Methods 0.000 description 2
- 230000002457 bidirectional effect Effects 0.000 description 2
- 238000004891 communication Methods 0.000 description 2
- 230000006870 function Effects 0.000 description 2
- 238000012986 modification Methods 0.000 description 2
- 230000004048 modification Effects 0.000 description 2
- 238000012163 sequencing technique Methods 0.000 description 2
- 230000000694 effects Effects 0.000 description 1
- 238000010801 machine learning Methods 0.000 description 1
- 230000005055 memory storage Effects 0.000 description 1
- 230000003287 optical effect Effects 0.000 description 1
- 230000000750 progressive effect Effects 0.000 description 1
- 230000001052 transient effect Effects 0.000 description 1
Abstract
The application relates to the field of computers and discloses a form data input method, a form data input device and a form data input medium, wherein the form data input method comprises the following steps: responding to a data input request sent by a user to acquire user input data; determining a target pull-down option corresponding to user input data according to a preset matching rule; generating a document object model element according to the target drop-down option, and displaying the target drop-down option on a drop-down option interface; user selection data is obtained to input the user selection data into the form and the document object model elements are purged. Therefore, according to the technical scheme, when the user inputs data, the document object model element is generated according to the target pull-down option corresponding to the user input data so as to be convenient for the user to select, and after the data input is completed, the document object model element is cleared, so that the data volume of the document object model element in the page is reduced, and the response speed of the page is improved.
Description
Technical Field
The present invention relates to the field of computers, and in particular, to a form data input method, device, and medium.
Background
When a user browses a web page or uses an application, data (e.g., user name information, text information, selection options, etc.) needs to be input to the web page and forms in the application to acquire a service. Drop down boxes are a common component of acquiring user data. The currently commonly used drop-down frame components include an el-select component provided by an element ui and a select component provided by an iviewUI, but these drop-down frame components generally store drop-down option data of an input frame in a document object model (Document Object Model, DOM) element, and when there are too many drop-down options, the loading speed of a page is affected, which leads to page jam and affects the use experience of a user.
Therefore, how to provide a new form data input method to prevent the excessive pull-down options of the pull-down frame from affecting the page loading speed is a problem that needs to be solved by those skilled in the art.
Disclosure of Invention
The method, the device and the medium for inputting the form data are provided to reduce the data quantity of the document object model elements in the page and improve the response speed of the page and the use experience of a user.
In order to solve the above technical problems, the present application provides a form data input method, including:
responding to a data input request sent by a user to acquire user input data;
determining a target pull-down option corresponding to the user input data according to a preset matching rule;
generating a document object model element according to the target pull-down option, and displaying the target pull-down option on a pull-down option interface;
user selection data is acquired to input the user selection data into a form and the document object model elements are cleared.
Preferably, the preset matching rule includes: pinyin matching and fuzzy matching;
correspondingly, the determining the target pull-down option corresponding to the user input data according to the preset matching rule comprises the following steps:
determining target drop-down options corresponding to each preset matching rule in a drop-down option library; the drop-down option library is a database which is arranged at the front end and is used for storing original option data.
Preferably, the determining the target pull-down options corresponding to each preset matching rule in the pull-down option library includes:
acquiring priority information of each preset matching rule, and sequencing the priority of each preset matching rule;
and sequentially determining the target pull-down options corresponding to the preset matching rules according to the priority order of the preset matching rules.
Preferably, the method further comprises:
acquiring a matching rule selection instruction input by a user through a form input button;
and determining priority information of each preset matching rule according to the matching rule selection instruction.
Preferably, the generating a document object model element according to the target drop-down option includes:
acquiring the original option data in the front-end local storage;
and rendering a document object model element which is consistent with the original option data in the drop-down option interface according to the original option data.
Preferably, the method further comprises:
creating a Vue instance for each target drop-down option, and performing data hijacking on the attribute information of the target drop-down option so as to process the data of the Vue instance;
compiling the Vue instance, analyzing the instruction and the expression of the Vue instance, and creating a corresponding monitor to acquire the dependent data of each target pull-down option, thereby establishing the association relation between each target pull-down option and the monitor.
Preferably, after the step of determining the target drop-down option corresponding to the user input data according to the preset matching rule, the method further includes:
if the target drop-down options corresponding to the user input data do not exist in the drop-down option library, recording the user input data and background information corresponding to the user input data;
and generating new drop-down option data according to the user input data and the background information, and storing the drop-down option data into the drop-down option library to update the drop-down options Xiang Ku.
In order to solve the above technical problem, the present application further provides a form data input device, including:
the acquisition module is used for responding to a data input request sent by a user to acquire user input data;
the determining module is used for determining a target pull-down option corresponding to the user input data according to a preset matching rule;
the generation module is used for generating a document object model element according to the target pull-down option and displaying the target pull-down option on a pull-down option interface;
and the clearing module is used for acquiring user selection data, inputting the user selection data into a form and clearing the document object model element.
In order to solve the technical problem, the application also provides a form data input device, which comprises a memory for storing a computer program;
and the processor is used for realizing the steps of the form data input method when executing the computer program.
In order to solve the above technical problem, the present application further provides a computer readable storage medium, where a computer program is stored, and the computer program when executed by a processor implements the steps of the form data input method.
The application provides a form data input method, which comprises the following steps: responding to a data input request sent by a user to acquire user input data; determining a target pull-down option corresponding to user input data according to a preset matching rule; generating a document object model element according to the target drop-down option, and displaying the target drop-down option on a drop-down option interface; user selection data is obtained to input the user selection data into the form and the document object model elements are purged. Therefore, according to the technical scheme, when the user inputs data, the document object model element is generated according to the target pull-down option corresponding to the user input data so as to be convenient for the user to select, and after the data input is completed, the document object model element is cleared, so that the data volume of the document object model element in the page is reduced, and the response speed of the page is improved.
In addition, the application also provides a form data input device and medium, which correspond to the method and have the same effects.
Drawings
For a clearer description of the embodiments of the present application, the drawings that are needed in the embodiments will be briefly described, it being apparent that the drawings in the following description are only some embodiments of the present application, and that other drawings may be obtained according to these drawings without inventive effort for a person skilled in the art.
Fig. 1 is a flowchart of a form data input method provided in an embodiment of the present application;
fig. 2 is a structural diagram of a form data input device provided in an embodiment of the present application;
fig. 3 is a block diagram of another form data input device according to an embodiment of the present application.
Detailed Description
The following description of the technical solutions in the embodiments of the present application will be made clearly and completely with reference to the drawings in the embodiments of the present application, and it is apparent that the described embodiments are only some embodiments of the present application, but not all embodiments. All other embodiments obtained by those skilled in the art based on the embodiments herein without making any inventive effort are intended to fall within the scope of the present application.
The core of the application is to provide a form data input method, a form data input device and a form data input medium so as to reduce the data quantity of file object model elements in a page and improve the response speed of the page and the use experience of a user.
Currently, common drop-down frame components (such as el-select of Element UI and select component of iview UI) can provide drop-down selection function, including searchable drop-down components, but these components often have not been fully considered, and under the condition of large data volume, more DOM elements are saved in the page, so that the page is jammed or even blocked. In order to solve the technical problem, the application provides a form data input method, which is characterized in that when a user inputs data, a document object model element is generated according to a target pull-down option corresponding to the user input data so as to be convenient for the user to select, and after the data input is completed, the document object model element is cleared so as to reduce the data quantity of the document object model element in a page, thereby improving the response speed of the page.
In order to provide a better understanding of the present application, those skilled in the art will now make further details of the present application with reference to the drawings and detailed description.
Fig. 1 is a flowchart of a form data input method provided in an embodiment of the present application, as shown in fig. 1, where the method includes:
s10: responding to a data input request sent by a user to acquire user input data;
s11: determining a target pull-down option corresponding to user input data according to a preset matching rule;
s12: generating a document object model element according to the target drop-down option, and displaying the target drop-down option on a drop-down option interface;
s13: user selection data is obtained to input the user selection data into the form and the document object model elements are purged.
The technical scheme provided by the application is applied to the user interaction page provided by the webpage or the application program, and the user inputs data into the form through an input box in the interaction page so as to acquire the service provided by the interaction page.
In specific implementation, the interaction page responds to a data input request sent by a user to acquire user input data, and a drop-down option matched with the user input data is displayed in a drop-down option interface, so that the user can conveniently input the data in the drop-down option interface into a drop-down input box in a mode of clicking a mouse or selecting a keyboard cursor, and data interaction is achieved.
It will be appreciated that the target drop-down options for the web page are stored in either the front-end storage area or the back-end storage area in the form of common data, and when the data entered by the user matches the data of any drop-down option, the drop-down option that matches is referred to as the target drop-down option. And generating a document object model element according to the target drop-down option, and displaying the target drop-down option on a drop-down option interface so as to facilitate the user to select the corresponding option. It should be noted that after the document object model element is generated, the relevant data of the target drop-down option is stored in the form of the document object model element, when the document object model element is too many in the page, the page will be blocked, so when the user finishes inputting (i.e. the user selection data is acquired), the document object model element corresponding to the text box needs to be cleared, so as to reduce the data volume of the page. Wherein the document object model is an interface (Application Programming Interface, API) for manipulating web page content. In the DOM, we can manipulate XML or HTML documents in a programming language (e.g., javaScript). DOM structures a document into a tree of nodes, which enables us to alter the content and structure of the document. There are many types of nodes in the DOM. For example, element nodes may correspond to respective element tags of HTML or XML, and attribute nodes may correspond to respective attributes of elements. Once a particular DOM element is obtained, various operations can be performed, such as changing the content of the element, modifying the attributes of the element, changing the style of the element, or modifying the structure of the element (such as inserting new sub-elements or deleting existing sub-elements).
The application provides a form data input method, which comprises the following steps: responding to a data input request sent by a user to acquire user input data; determining a target pull-down option corresponding to user input data according to a preset matching rule; generating a document object model element according to the target drop-down option, and displaying the target drop-down option on a drop-down option interface; user selection data is obtained to input the user selection data into the form and the document object model elements are purged. Therefore, according to the technical scheme, when the user inputs data, the document object model element is generated according to the target pull-down option corresponding to the user input data so as to be convenient for the user to select, and after the data input is completed, the document object model element is cleared, so that the data volume of the document object model element in the page is reduced, and the response speed of the page is improved.
It is understood that the preset matching rule is a matching rule predetermined by the service provider, and the common matching rule includes fuzzy matching, english matching, pinyin matching, and the like. After the user starts the man-machine interaction window, relevant data are input into the input box, and the current page automatically matches the drop-down options corresponding to the input data according to the matching rules so as to be convenient for the user to select.
Specifically, determining, according to a preset matching rule, a target pull-down option corresponding to user input data includes: determining target drop-down options corresponding to each preset matching rule in a drop-down option library; the drop-down option library is a database which is arranged at the front end and is locally stored and used for storing original option data.
In specific implementation, the preset matching rule may be one or more, which is not limited herein.
On the basis of the above embodiment, when there are a plurality of preset matching rules, determining the target pull-down options corresponding to each preset matching rule in the pull-down option library includes: acquiring priority information of each preset matching rule, and sequencing the priority of each preset matching rule; and sequentially determining target drop-down options corresponding to the preset matching rules according to the priority order of the preset matching rules.
For example: when the priority of pinyin matching, fuzzy matching and English matching is gradually reduced, after the user inputs data, firstly matching the data input by the user according to the pinyin matching rule, and if the related data is not matched or the matched data quantity is smaller than a threshold value, matching the data input by the user according to the fuzzy matching rule; and if the related data are still not matched or the matched data quantity is smaller than the threshold value, matching the data input by the user according to the English matching rule.
It will be appreciated that the priorities of the different matching rules may be rules predetermined by the service provider or may be set by the user himself.
On the basis of the above embodiment, the form data input method further includes: acquiring a matching rule selection instruction input by a user through a form input button; and determining priority information of each preset matching rule according to the matching rule selection instruction.
In the implementation, an input frame is added first, and bidirectional binding is customized so as to facilitate the subsequent processing of data, and various methods required by a drop-down frame are added to complete initialization. By setting tips valCanblank it is determined whether it is necessary to reset back the previous content if the query content does not match the directory list. If the searched content is empty or not empty with the directory, displaying as the first item by default, or not processing the content of the input box by default and not modifying the content of the query directory. Judging whether the swing of pinyin is supported or not through a propsuppport Pinyin Filter field, and if so, initializing a pinyin query method. The configuration process of other matching rules is similar to this. When the drop-down directory is selected or closed each time, the original drop-down option list is added with a timer to carry out clearing treatment, so that the existence of DOM elements in the page is reduced, the consumption of performance is reduced, and the response speed of the page is improved.
In implementations, generating the document object model element from the target drop-down option includes: acquiring original option data in front-end local storage; and rendering document object model elements corresponding to the original option data in the drop-down option interface according to the original option data.
In one embodiment of the present invention, after current original data is read from a cache of a browser, a DOM structure corresponding to the current original data is rendered in a vanishing window of the browser according to the current original data, where the DOM structure includes any one or more of an input text box, a checkbox check box, a radio single selection box, a select drop-down box, a common help box, a longtext long text edit box, a datepicker time selection box, and a diyinput custom edit type. For example, after the user scrolls the employee information table to the target area, the user stops scrolling, edits the information of the employees in the range, and renders each DOM structure in the target area according to the read current original data, wherein the first column is the name of the employee, the DOM type is an input text box, the second column is the gender, the DOM type is a radio single box, the third column is the birth month, the DOM type is a datepicker time box, the fourth column is the business year, the DOM type is a select drop-down box, and the like.
As a preferred embodiment, after the step of determining the target drop-down option corresponding to the user input data according to the preset matching rule, the method further includes: if the target drop-down options corresponding to the user input data do not exist in the drop-down option library, recording the user input data and background information corresponding to the user input data; new pull-down option data is generated according to the user input data and the background information, and the pull-down option data is stored in a pull-down option library to update the pull-down options Xiang Ku.
Further, two-way data binding is required for each target drop-down option. Specifically, a Vue instance is created for each target drop-down option, and data hijacking is carried out on the attribute information of the target drop-down option so as to process the data of the Vue instance;
compiling the Vue instance, analyzing the instruction and the expression of the Vue instance, and creating a corresponding monitor to acquire the dependent data of each target pull-down option, thereby establishing the association relationship between each target pull-down option and the monitor, and further completing the bidirectional data binding.
When the Vue instance is created, vue2 will hijack all the attributes in the data option of the target drop-down option. This converts each attribute into a get and a set by using the object. Define property () method, and triggers a corresponding operation when data is accessed or modified.
Creation of a watch listener: when the template is compiled, vue2 parses the instructions and expressions in the template and creates the corresponding watch listener. Each watch is associated with a piece of data, is responsible for listening for changes to that data, and updates the associated view.
Dependency collection: in the template compiling process, the Watcher automatically collects data (such as data, computed, props and the like) depending on the target pull-down option, and an association relationship between the data and the Watcher is established. Thus, when the data changes, the corresponding watch which needs to be updated can be found and notified to update.
Publish-subscribe mode: when the data changes, the data hijacking triggers the setter function and invokes the dispatch center of the publish-subscribe mode. The dispatch center will sequentially notify these watches for updates based on the relevant watch list collected by the dependencies.
View update: each notified watch will perform a corresponding update operation, such as re-rendering the view or updating the DOM element. In this way, changes in data can be reflected in real-time into the view.
In the above embodiments, the form data input method is described in detail, and the present application further provides embodiments corresponding to the form data input device. It should be noted that the present application describes an embodiment of the device portion from two angles, one based on the angle of the functional module and the other based on the angle of the hardware.
Fig. 2 is a structural diagram of a form data input device provided in an embodiment of the present application, as shown in fig. 2, the device includes:
an acquisition module 10 for acquiring user input data in response to a data input request sent by a user;
a determining module 11, configured to determine a target drop-down option corresponding to user input data according to a preset matching rule;
the generating module 12 is used for generating a document object model element according to the target drop-down option and displaying the target drop-down option on a drop-down option interface;
the clearing module 13 is configured to obtain user selection data, input the user selection data to the form, and clear the document object model element.
In addition, the form data input device provided by the application further comprises a priority information determining module, a pull-down option association module and a pull-down option library updating module.
The priority information determining module is used for acquiring a matching rule selection instruction input by a user through a form input button; and determining priority information of each preset matching rule according to the matching rule selection instruction.
The drop-down option association module is used for creating a Vue instance for each target drop-down option, and carrying out data hijacking on the attribute information of the target drop-down option so as to process the data of the Vue instance; compiling the Vue instance, analyzing the instruction and the expression of the Vue instance, and creating a corresponding monitor to acquire the dependent data of each target pull-down option, thereby establishing the association relation between each target pull-down option and the monitor.
The drop-down selection Xiang Ku updating module is used for recording the user input data and background information corresponding to the user input data if the target drop-down options corresponding to the user input data do not exist in the drop-down option library after the step of determining the target drop-down options corresponding to the user input data according to the preset matching rule; new pull-down option data is generated according to the user input data and the background information, and the pull-down option data is stored in a pull-down option library to update the pull-down options Xiang Ku.
Since the embodiments of the apparatus portion and the embodiments of the method portion correspond to each other, the embodiments of the apparatus portion are referred to the description of the embodiments of the method portion, and are not repeated herein.
The embodiment provides a form data input device, including: responding to a data input request sent by a user to acquire user input data; determining a target pull-down option corresponding to user input data according to a preset matching rule; generating a document object model element according to the target drop-down option, and displaying the target drop-down option on a drop-down option interface; user selection data is obtained to input the user selection data into the form and the document object model elements are purged. Therefore, according to the technical scheme, when the user inputs data, the document object model element is generated according to the target pull-down option corresponding to the user input data so as to be convenient for the user to select, and after the data input is completed, the document object model element is cleared, so that the data volume of the document object model element in the page is reduced, and the response speed of the page is improved.
Fig. 3 is a structural diagram of a form data input device according to another embodiment of the present application, and as shown in fig. 3, the form data input device includes: a memory 20 for storing a computer program;
the processor 21 is configured to implement the steps of the form data input method according to the above embodiment when executing the computer program.
The form data input device provided in this embodiment may include, but is not limited to, a smart phone, a tablet computer, a notebook computer, a desktop computer, or the like.
Processor 21 may include one or more processing cores, such as a 4-core processor, an 8-core processor, etc. The processor 21 may be implemented in hardware in at least one of a digital signal processor (Digital Signal Processor, DSP), a Field programmable gate array (Field-Programmable Gate Array, FPGA), a programmable logic array (Programmable Logic Array, PLA). The processor 21 may also comprise a main processor, which is a processor for processing data in an awake state, also called central processor (Central Processing Unit, CPU), and a coprocessor; a coprocessor is a low-power processor for processing data in a standby state. In some embodiments, the processor 21 may be integrated with an image processor (Graphics Processing Unit, GPU) for taking care of rendering and rendering of the content that the display screen is required to display. In some embodiments, the processor 21 may also include an artificial intelligence (Artificial Intelligence, AI) processor for processing computing operations related to machine learning.
Memory 20 may include one or more computer-readable storage media, which may be non-transitory. Memory 20 may also include high-speed random access memory, as well as non-volatile memory, such as one or more magnetic disk storage devices, flash memory storage devices. In this embodiment, the memory 20 is at least used for storing a computer program 201, where the computer program, after being loaded and executed by the processor 21, can implement the relevant steps of the form data input method disclosed in any of the foregoing embodiments. In addition, the resources stored in the memory 20 may further include an operating system 202, data 203, and the like, where the storage manner may be transient storage or permanent storage. The operating system 202 may include Windows, unix, linux, among others. The data 203 may include, but is not limited to, user input data, user selection data, and the like.
In some embodiments, the form data input device may further include a display 22, an input/output interface 23, a communication interface 24, a power supply 25, and a communication bus 26.
It will be appreciated by those skilled in the art that the structure shown in fig. 3 is not limiting of the form data input device and may include more or fewer components than shown.
The form data input device provided by the embodiment of the application comprises a memory and a processor, wherein when the processor executes a program stored in the memory, the processor can realize the following method: responding to a data input request sent by a user to acquire user input data; determining a target pull-down option corresponding to user input data according to a preset matching rule; generating a document object model element according to the target drop-down option, and displaying the target drop-down option on a drop-down option interface; user selection data is obtained to input the user selection data into the form and the document object model elements are purged.
Finally, the present application also provides a corresponding embodiment of the computer readable storage medium. The computer-readable storage medium has stored thereon a computer program which, when executed by a processor, performs the steps as described in the method embodiments above.
It will be appreciated that the methods of the above embodiments, if implemented in the form of software functional units and sold or used as stand-alone products, may be stored on a computer readable storage medium. With such understanding, the technical solution of the present application, or a part contributing to the prior art or all or part of the technical solution, may be embodied in the form of a software product stored in a storage medium, performing all or part of the steps of the method described in the various embodiments of the present application. And the aforementioned storage medium includes: a U-disk, a removable hard disk, a Read-Only Memory (ROM), a random access Memory (RanDOM Access Memory, RAM), a magnetic disk, or an optical disk, or other various media capable of storing program codes.
The form data input method, the form data input device and the form data input medium provided by the application are described in detail. In the description, each embodiment is described in a progressive manner, and each embodiment is mainly described by the differences from other embodiments, so that the same similar parts among the embodiments are mutually referred. For the device disclosed in the embodiment, since it corresponds to the method disclosed in the embodiment, the description is relatively simple, and the relevant points refer to the description of the method section. It should be noted that it would be obvious to those skilled in the art that various improvements and modifications can be made to the present application without departing from the principles of the present application, and such improvements and modifications fall within the scope of the claims of the present application.
It should also be noted that in this specification, relational terms such as first and second, and the like are used solely to distinguish one entity or action from another entity or action without necessarily requiring or implying any actual such relationship or order between such entities or actions. Moreover, the terms "comprises," "comprising," or any other variation thereof, are intended to cover a non-exclusive inclusion, such that a process, method, article, or apparatus that comprises a list of elements does not include only those elements but may include other elements not expressly listed or inherent to such process, method, article, or apparatus. Without further limitation, an element defined by the phrase "comprising one … …" does not exclude the presence of other like elements in a process, method, article, or apparatus that comprises the element.
Claims (7)
1. The form data input method is characterized by comprising the following steps of:
responding to a data input request sent by a user to acquire user input data;
acquiring priority information of each preset matching rule, and after the priority ordering of each preset matching rule, sequentially determining target pull-down options corresponding to each preset matching rule in a pull-down option library according to the priority order of each preset matching rule; the drop-down option library is a database which is arranged at the front end and is locally stored and used for storing original option data, and the preset matching rule comprises: pinyin matching and fuzzy matching;
acquiring the original option data in the front-end local storage, rendering a document object model element corresponding to the original option data in the drop-down option interface according to the original option data, and displaying the target drop-down option in the drop-down option interface;
user selection data is acquired to input the user selection data into a form and the document object model elements are cleared.
2. The form data input method according to claim 1, further comprising:
acquiring a matching rule selection instruction input by a user through a form input button;
and determining priority information of each preset matching rule according to the matching rule selection instruction.
3. The form data input method according to claim 1 or 2, characterized by further comprising:
creating a Vue instance for each target drop-down option, and performing data hijacking on the attribute information of the target drop-down option so as to process the data of the Vue instance;
compiling the Vue instance, analyzing the instruction and the expression of the Vue instance, and creating a corresponding monitor to acquire the dependent data of each target pull-down option, thereby establishing the association relation between each target pull-down option and the monitor.
4. The form data input method according to claim 1, wherein after the step of sequentially determining the target pull-down options corresponding to each preset matching rule in the pull-down option library, the method further comprises:
if the target drop-down options corresponding to the user input data do not exist in the drop-down option library, recording the user input data and background information corresponding to the user input data;
and generating new drop-down option data according to the user input data and the background information, and storing the drop-down option data into the drop-down option library to update the drop-down options Xiang Ku.
5. A form data input device, comprising:
the acquisition module is used for responding to a data input request sent by a user to acquire user input data;
the determining module is used for acquiring the priority information of each preset matching rule, and sequentially determining target pull-down options corresponding to each preset matching rule in the pull-down option library according to the priority sequence of each preset matching rule after the priority ordering of each preset matching rule; the drop-down option library is a database which is arranged at the front end and is locally stored and used for storing original option data, and the preset matching rule comprises: pinyin matching and fuzzy matching;
the generation module is used for acquiring the original option data in the front-end local storage, rendering document object model elements which are the same as the original option data in the drop-down option interface according to the original option data, and displaying the target drop-down option in the drop-down option interface;
and the clearing module is used for acquiring user selection data, inputting the user selection data into a form and clearing the document object model element.
6. Form data input device, characterized in that it comprises a memory for storing a computer program;
a processor for implementing the steps of the form data input method according to any one of claims 1 to 4 when executing the computer program.
7. A computer-readable storage medium, wherein a computer program is stored on the computer-readable storage medium, which when executed by a processor, implements the steps of the form data input method according to any one of claims 1 to 4.
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202311517221.1A CN117235397B (en) | 2023-11-14 | 2023-11-14 | Form data input method, device and medium |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN202311517221.1A CN117235397B (en) | 2023-11-14 | 2023-11-14 | Form data input method, device and medium |
Publications (2)
| Publication Number | Publication Date |
|---|---|
| CN117235397A CN117235397A (en) | 2023-12-15 |
| CN117235397B true CN117235397B (en) | 2024-03-15 |
Family
ID=89096943
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN202311517221.1A Active CN117235397B (en) | 2023-11-14 | 2023-11-14 | Form data input method, device and medium |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN117235397B (en) |
Citations (8)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN103793499A (en) * | 2010-12-07 | 2014-05-14 | 奇智软件（北京）有限公司 | Method and device for obtaining application information through address bar of browser |
| CN103885943A (en) * | 2012-12-19 | 2014-06-25 | 北大方正集团有限公司 | Method for achieving drop-down list box control in webpage |
| CN109408056A (en) * | 2018-10-15 | 2019-03-01 | 四川长虹电器股份有限公司 | A kind of combobox component |
| CN111222066A (en) * | 2019-12-31 | 2020-06-02 | 航天信息股份有限公司广州航天软件分公司 | Pull-down component system and method for event processing and searching |
| CN112114726A (en) * | 2020-07-31 | 2020-12-22 | 福建亿能达信息技术股份有限公司 | Interaction method, device, equipment and medium based on vue drop-down box |
| CN114254228A (en) * | 2021-12-20 | 2022-03-29 | 杭州安恒信息技术股份有限公司 | Web application processing method and related device for dynamically binding data |
| CN114995904A (en) * | 2022-05-31 | 2022-09-02 | 中国银行股份有限公司 | Pull-down frame component loading method and related device |
| CN115712769A (en) * | 2022-11-22 | 2023-02-24 | 四川启睿克科技有限公司 | Method for realizing Input and pull-down and fuzzy search based on Input label |
Family Cites Families (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US20020167548A1 (en) * | 2001-05-14 | 2002-11-14 | Murray La Tondra | Method, system, and computer-program product for the customization of drop-down list boxes using hot lists |
-
2023
- 2023-11-14 CN CN202311517221.1A patent/CN117235397B/en active Active
Patent Citations (8)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN103793499A (en) * | 2010-12-07 | 2014-05-14 | 奇智软件（北京）有限公司 | Method and device for obtaining application information through address bar of browser |
| CN103885943A (en) * | 2012-12-19 | 2014-06-25 | 北大方正集团有限公司 | Method for achieving drop-down list box control in webpage |
| CN109408056A (en) * | 2018-10-15 | 2019-03-01 | 四川长虹电器股份有限公司 | A kind of combobox component |
| CN111222066A (en) * | 2019-12-31 | 2020-06-02 | 航天信息股份有限公司广州航天软件分公司 | Pull-down component system and method for event processing and searching |
| CN112114726A (en) * | 2020-07-31 | 2020-12-22 | 福建亿能达信息技术股份有限公司 | Interaction method, device, equipment and medium based on vue drop-down box |
| CN114254228A (en) * | 2021-12-20 | 2022-03-29 | 杭州安恒信息技术股份有限公司 | Web application processing method and related device for dynamically binding data |
| CN114995904A (en) * | 2022-05-31 | 2022-09-02 | 中国银行股份有限公司 | Pull-down frame component loading method and related device |
| CN115712769A (en) * | 2022-11-22 | 2023-02-24 | 四川启睿克科技有限公司 | Method for realizing Input and pull-down and fuzzy search based on Input label |
Non-Patent Citations (3)
| Title |
|---|
| Vue.js在前端开发应用中的性能影响研究;唐斌斌;叶奕;;电子制作(第10期);全文 * |
| Web 前端架构模式的演化及MVVM 模式在 Web 前端框架中的研究;马利军;软件;第第44卷卷(第第7期期);全文 * |
| 张哲.短视频社区 产品 运营与商业化.北京：机械工业出版社,2022,第81页. * |
Also Published As
| Publication number | Publication date |
|---|---|
| CN117235397A (en) | 2023-12-15 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| KR101312867B1 (en) | Markup based extensibility for user interfaces | |
| US9858253B2 (en) | Browser extension for web form capture | |
| US6252594B1 (en) | Method and system for aiding a user in scrolling through a document using animation, voice cues and a dockable scroll bar | |
| US7895179B2 (en) | Asynchronous updating of web page data views | |
| US20150012818A1 (en) | System and method for semantics-concise interactive visual website design | |
| KR102345002B1 (en) | Patent document creating device, method, computer program, computer-readable recording medium, server and system | |
| US10055392B2 (en) | History-based archive management | |
| JP7395475B2 (en) | System and method for generating and editing text content in a website construction system | |
| US9026992B2 (en) | Folded views in development environment | |
| US9535667B2 (en) | Content collapse outside of selection | |
| US11822615B2 (en) | Contextual editing in a page rendering system | |
| JP2011159284A (en) | Website font previewing | |
| Ashok et al. | Web screen reading automation assistance using semantic abstraction | |
| KR20150085716A (en) | Setup Method for Web Scraping Data Extraction | |
| Whiting et al. | Creating an iPhone application for collecting continuous ABC data | |
| CN114036443A (en) | Page generation method and device | |
| CN107783983B (en) | Information display method and device | |
| CN117235397B (en) | Form data input method, device and medium | |
| CN110780970A (en) | Data screening method, device, equipment and computer readable storage medium | |
| KR101989634B1 (en) | Creating logic using pre-built controls | |
| CN114090002A (en) | Front-end interface construction method and device, electronic equipment and storage medium | |
| Tallis et al. | The Briefing Associate: A Role for COTS applications in the Semantic Web. | |
| Aryal | Bootstrap: a front-end framework for responsive web design | |
| TWI834538B (en) | Interface generating system and interface generating method | |
| KR20190014195A (en) | System and method for presenting fonts through retrieval |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| PB01 | Publication | ||
| PB01 | Publication | ||
| SE01 | Entry into force of request for substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| GR01 | Patent grant | ||
| GR01 | Patent grant |