Recommend 10 good jquery form action code fragment

Code Fragment 1: Disable "Enter" in the form
The following code is certainly helpful when you might want to prevent users from accidentally submitting a form in the form's operations:

The code is as follows	Copy Code
$ ("#form"). KeyPress (function (e) { if (E.which = = 13) { return false; } });

Code Fragment 2: Clear all form data
You may need to invoke different types of clear methods for different forms, but using this out-of-the-box method will definitely save you a lot of effort.

The code is as follows

Copy Code

function ClearForm (form) { Iterate over the ' inputs for the ' form element that is passed in $ (': input ', form). each (function () { var type = This.type; var tag = This.tagName.toLowerCase (); Normalize case It's OK to reset the value attr of text inputs, Password inputs, and Textareas if (type = = ' text ' | | | type = = ' Password ' | | | tag = = ' textarea ') This.value = ""; Checkboxes and radios need to have their checked state cleared But should *not* have their ' value ' changed else if (type = = ' checkbox ' | | | type = = ' Radio ') this.checked = false; Select elements need to have their ' selectedindex ' property set To-1 (This works for both single and multiple select elements) else if (tag = ' SELECT ') This.selectedindex =-1; }); };

Code Fragment 3: Disable the buttons in the form
The following code is useful for AJAX operations, and you can effectively prevent users from submitting data multiple times, and individuals often use:

Online Debugging Online Demo

Disable button:

The code is as follows	Copy Code
$ ("#somebutton"). attr ("Disabled", true);

Start button:

The code is as follows	Copy Code
$ ("#submit-button"). Removeattr ("Disabled");

You may often use. attr (' disabled ', false), but this is not the correct call.

Code Fragment 4: Enable the submit button after entering content
This code is similar to the above, and belongs to the help user to control the form Submit button. After using this code, the Submit button can be started only after the user enters the specified content.

Online Debugging Online Demo

The code is as follows	Copy Code
$ (' #username '). KeyUp (function () { $ (' #submit '). attr (' disabled ',!$ (' #username '). Val ()); });

Code Fragment 5: Prevent multiple submission of forms
Submitting a form multiple times is a headache for Web applications, and the following code is a great way to help you solve this problem:

The code is as follows	Copy Code
$ (document). Ready (function () { $ (' form '). Submit (function () { if (typeof Jquery.data (This, "disabledonsubmit") = = ' undefined ') { Jquery.data (This, "Disabledonsubmit", {submited:true}); $ (' input[type=submit], Input[type=button] ', this ". each (function () { $ (this). attr ("Disabled", "disabled"); }); return true; } Else { return false; } }); });

Code Fragment 6: Highlight the current focus of the input box to indicate
Sometimes you need to prompt the user for the current operation of the input box, you can use the following code to highlight the indicator:

Online Debugging Online Demo

The code is as follows	Copy Code
$ ("Form:input"). focus (function () { $ ("label[for= '" + this.id + "']"). AddClass ("Labelfocus"); }). blur (function () { $ ("label"). Removeclass ("Labelfocus"); });

Code fragment 7: adding form elements dynamically
This method can help you dynamically add elements of the form, such as input, etc.:

Online Debugging Online Demo

The code is as follows	Copy Code
Change event on Password1 field to prompt new input $ (' #password1 '). Change (function () { Dynamically create new input and insert after Password1 $ ("#password1"). Append ("<input type= ' text ' name= ' password2 ' id=" Password2 '/> '); });

Code fragment 8: Automatically import data into Selectbox
The following code can automatically generate the contents of the selection box using AJAX data

code is as follows

copy code

$ (function () {   $ ("Select#ctljob"). Change (function () {     $.getjson ("/select.php", {ID: $ (this). Val (), Ajax: ' True '}, function (j) {        var options = ';       for (var i = 0; I < j.length i++) {      &nbs p;  options = ' <option value= ' + j[i].optionvalue + ' "> ' + j[i].optiondisplay + ' < /option> ';      }       $ ("Select#ctlperson"). html (options);    })  }) })

Code Fragment 9: Determine if a check box is selected
The code is simple, as follows:

Online Debugging Online Demo

The code is as follows	Copy Code
$ (' #checkBox '). attr (' checked ');

Code Fragment 10: Submitting a form by using code
The code is simple, as follows:

Online Debugging Online Demo

The code is as follows	Copy Code
$ ("#myform"). Submit ();

I hope you feel that these jquery code will be helpful to your development, if you have similar code, please share with us!