There are four methods for form submission: 1. "$.ajaxSubmit" method, which requires the use of the "jquery.form" plug-in; 2. "$.getJSON" method, which submits data in GET mode; 3. " $.post" method, which receives relatively large data; 4. "$.ajax" method, which generally encapsulates asynchronous methods.
The operating environment of this tutorial: windows10 system, jquery3.2.1 version, Dell G3 computer.
There are many ways to submit forms in jQuery. Now let’s talk about the four commonly used ones, namely ajaxSubmit() and getJSON. (), post(), ajax().
1. $.ajaxSubmit method
Using ajaxSubmit() to submit a form must first be implemented by using the third-party plug-in jquery.form.
Under normal circumstances, if you submit directly using the form, the current page after submission will jump to the page pointed to by the action in the form. If we do not want the page to jump after submitting the form, then we can use ajaxSubmit() method to submit.
Next, let’s take a look at the writing method submitted by ajaxSubmit():
Html:
**jQuery: **1. Original writing method (this writing method does not need to be used in the form form Fill in the path inside)
2. Simple writing method
2. $.getJSON method
relative to JSON Compared with the traditional direct transmission of naked data through GET and POST, JSON is more structurally reasonable and safer. The getJSON() function is just a simplified version of the ajax() function that sets the JSON function. Compared with get() and post(), it has certain advantages in passing data and can be used across time.
Note: Because $.getJSON submits data in GET mode, you cannot submit an excessive amount of data. You can choose $.post to submit.
Writing method: Html:
jQuery:
##3. $ .post method
As mentioned above, the post() function can be used to receive a relatively large amount of data. This is an advantage over other methods. Usually in many cases we will choose to use the post() method to submit the form.
Let’s take a look at how it is written:
Html: (Same as the html submitted by $.getJSON)
jQuery:
//提交按钮的点击事件 function btnSubmit(id) { //获取页面数据 var id = $("#myForm [name='id']").val(); //提交表单 $.post("url", //请求路径 { id: id //参数 }, function (¬data) { if (data.State) { alert(data.Text); } else { alert(data.Text); } }, "json"); }
4. $.ajax method
$ .ajax is a commonly usedordinary encapsulation asynchronous method.
Html: (Same as the html submitted by $.getJSON)
jQuery:
Note : Generally, in simple cases, $.ajax can be used directly without any parameters.
The above is the detailed content of What are the methods of jquery form submission?. For more information, please follow other related articles on the PHP Chinese website!