怎么在jQuery中利用Ajax實(shí)現(xiàn)一個(gè)表單提交功能
這篇文章將為大家詳細(xì)講解有關(guān)怎么在jQuery中利用Ajax實(shí)現(xiàn)一個(gè)表單提交功能，文章內(nèi)容質(zhì)量較高，因此小編分享給大家做個(gè)參考，希望大家閱讀完這篇文章后對(duì)相關(guān)知識(shí)有一定的了解。
創(chuàng)新互聯(lián)建站是一家專業(yè)提供特克斯企業(yè)網(wǎng)站建設(shè),專注與網(wǎng)站設(shè)計(jì)制作、成都網(wǎng)站建設(shè)、H5技術(shù)、小程序制作等業(yè)務(wù)。10年已為特克斯眾多企業(yè)、政府機(jī)構(gòu)等服務(wù)。創(chuàng)新互聯(lián)專業(yè)網(wǎng)站建設(shè)公司優(yōu)惠進(jìn)行中。
一、準(zhǔn)備
1、頁(yè)面引入jQuery文件
2、頁(yè)面引入jQuery的表單插件jQuery.form.js
二、實(shí)施
1、頁(yè)面中的表單
2、提交表單的代碼
$("#agreementSub").on("click",function(){
$('#mainForm').ajaxSubmit( //ajax方式提交表單
{
url: '/personal/kaike',
type: 'post',
dataType: 'json',
beforeSubmit: function () {},
success: function (data) {
if (data.Res == "True" || data.Res == true) {
$('.jsrz_main_check').html('您的申請(qǐng)已提交，我們將會(huì)在1-2個(gè)工作日內(nèi)進(jìn)行審核，請(qǐng)耐心等待!');
} else {
alert(data.Msg);
}
},
clearForm: false,//禁止清楚表單
resetForm: false //禁止重置表單
});
});點(diǎn)擊提交按鈕觸發(fā)綁定的click事件。
$('#mainForm').ajaxSubmit()//中的代碼部分也可以封裝為一個(gè)方法，在其他地方調(diào)用。三、不使用jQuery.from表單插件的方式
$("#maniForm").submit(function (envent)
{
envent.preventDefault();
var form = $(this);
$.ajax({
url: form.attr("action"),
type: form.attr("mathod"),
data: form.serialize(),
dataType: "json",
beforeSend: function ()
{
$("#ajax-loader").show();
},
error: function ()
{
},
complete:function () {
$("#ajax-loader").hide();
},
success: function (data)
{
$("#article").html(data);
}
});
});關(guān)于怎么在jQuery中利用Ajax實(shí)現(xiàn)一個(gè)表單提交功能就分享到這里了，希望以上內(nèi)容可以對(duì)大家有一定的幫助，可以學(xué)到更多知識(shí)。如果覺(jué)得文章不錯(cuò)，可以把它分享出去讓更多的人看到。
本文題目：怎么在jQuery中利用Ajax實(shí)現(xiàn)一個(gè)表單提交功能
網(wǎng)頁(yè)網(wǎng)址：
http://weahome.cn/article/jogpco.html
重慶分公司
重慶分公司
