jquery selector to quickly extract web form data example_jquery

I am relatively lazy. When doing web work, when I have to repeat the same thing many times, I want to find a way to save time and effort.

In the past, when submitting a form on the web and needing to verify user input, document.getElementById() was used in js when extracting user input information. This way, one or two form fields is okay, but there are many cases. (I have encountered more than a dozen situations) It’s dazzling to look at, so I am personally disgusted with this method, but fortunately, I thought about it myself and found a convenient method using jquery.

I added an additional attribute to each form field that needs to submit data, and replaced the original name attribute with my own additional defined attribute "_postField", such as and so on, and then use query to obtain all DOM objects with _postField attributes, traverse them, and encapsulate them with the value of _postField as the key. The content is a json key-value pair of value, and its js method is as follows:

Copy code The code is as follows:

Test code:

Copy Code The code is as follows:

Male
Female
neutral



< option value="Go to work">Go to work
Begging
What None

<script> <br>function test(){ <br>var postData = getFormField("_postField"); <br><br> var sb = []; <br>for(var o in postData){ <br>sb.push(o "=" postData[o]); <br>} <br>alert(sb.join("n" )); <br>} <br></script>

The above example has relatively few form fields, and some things cannot be reflected, but when the form When the number of fields is compared, its convenience and better reusability can be reflected; furthermore, if jquery is used to submit asynchronously, even the manual operation of encapsulating json data is saved.
Some people may not want to add a custom field like "_postField" to the form field, so they can just use the existing name. This is just a different use of jquery selectors, but the essence is still the same.