這篇文章將為大家詳細講解有關怎么在jQuery中利用Ajax實現(xiàn)一個表單提交功能，文章內(nèi)容質(zhì)量較高，因此小編分享給大家做個參考，希望大家閱讀完這篇文章后對相關知識有一定的了解。

創(chuàng)新互聯(lián)建站是一家專業(yè)提供特克斯企業(yè)網(wǎng)站建設,專注與網(wǎng)站設計制作、成都網(wǎng)站建設、H5技術、小程序制作等業(yè)務。10年已為特克斯眾多企業(yè)、政府機構等服務。創(chuàng)新互聯(lián)專業(yè)網(wǎng)站建設公司優(yōu)惠進行中。

一、準備

1、頁面引入jQuery文件

2、頁面引入jQuery的表單插件jQuery.form.js

二、實施

1、頁面中的表單

<form id="mainForm" method="post" enctype="multipart/form-data" class="jsrz_main_information">
   <input type="text" name="UserName" value="" />
   <div class="jsrz_main_button">
        <input type="submit" value="提交" id="agreementSub">
    </div>
</form>

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('您的申請已提交，我們將會在1-2個工作日內(nèi)進行審核，請耐心等待!');
          } else {
            alert(data.Msg);
          }
        },
        clearForm: false,//禁止清楚表單
        resetForm: false //禁止重置表單
      });
});

點擊提交按鈕觸發(fā)綁定的click事件。

$('#mainForm').ajaxSubmit()//中的代碼部分也可以封裝為一個方法，在其他地方調(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);
    }
  });
});

關于怎么在jQuery中利用Ajax實現(xiàn)一個表單提交功能就分享到這里了，希望以上內(nèi)容可以對大家有一定的幫助，可以學到更多知識。如果覺得文章不錯，可以把它分享出去讓更多的人看到。

分享名稱：怎么在jQuery中利用Ajax實現(xiàn)一個表單提交功能
本文來源：http://www.chinadenli.net/article20/jogpco.html

成都網(wǎng)站建設公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)站設計公司、企業(yè)建站、品牌網(wǎng)站建設、面包屑導航、電子商務、App設計

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉載內(nèi)容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉載，或轉載時需注明來源： 創(chuàng)新互聯(lián)