jquery實現ajax提交form表單的方法總結

 本篇文章主要是對jquery實現ajax提交form表單的方法進行了總結介紹，需要的朋友可以過來參考下，希望對大家有所協助

方法一：   代碼如下:function AddHandlingFeeToRefund()         {            var AjaxURL= "../OrderManagement/AjaxModifyOrderService.aspx";                   alert($('#formAddHandlingFee').serialize());                $.ajax({                    type: "POST",                    dataType: "html",                    url: AjaxURL + '?Action=' + 'SubmitHandlingFee' + '&OrderNumber=' + $.trim($("#<%=this.txtOrderNumber.ClientID %>").val()),                    data: $('#formAddHandlingFee').serialize(),                    success: function (result) {                        var strresult=result;                        alert(strresult);                        //載入最大可退金額                        $("#spanMaxAmount").html(strresult);                    },                    error: function(data) {                        alert("error:"+data.responseText);                     }                 });         }  方法二：代碼如下:        //ajax提交form表單的方式        $('#formAddHandlingFee').submit(function() {            var AjaxURL= "../OrderManagement/AjaxModifyOrderService.aspx";                   alert($('#formAddHandlingFee').serialize());                $.ajax({                    type: "POST",                    dataType: "html",                    url: AjaxURL + '?Action=' + 'SubmitHandlingFee' + '&OrderNumber=' + $.trim($("#<%=this.txtOrderNumber.ClientID %>").val()),                    data: $('#formAddHandlingFee').serialize(),                    success: function (data) {                        var strresult=data;                        alert(strresult);                        //載入最大可退金額                        $("#spanMaxAmount").html(strresult);                    },                    error: function(data) {                        alert("error:"+data.responseText);                     }                 });        }     );  頁面html代碼： 代碼如下:                  <form id="formAddHandlingFee" name="formAddHandlingFee" enctype="multipart/form-data" onsubmit="AddHandlingFeeToRefund()">                    <table id="AddHandlingFee" class="Wfill">                        <tr>                            <td>                                <asp:Literal ID="UI_Amount" runat="server" Text="處理費用" meta:resourcekey="HandlingFeeAmount" />                            </td>                            <td>                                <input type="text" id="txtHandlingFeeAmount" name="txtHandlingFeeAmount"  class="{required:true,number:true}" maxlength="12" />                            </td>                        </tr>                        <tr>                            <td>                                <asp:Literal ID="UI_HandlingFeeType" runat="server" Text="費用類型" meta:resourcekey="HandlingFeeHandlingFeeType" />                            </td>                            <td>                                <crmweb:HtmlSelectControl ID="HandlingFeeType" EnumTypeName="DX.OMS.Model.Common.HandlingFeeType,DX.OMS.Model.Common" EmptyValue="" EmptyText="Select" runat="server" class="text {required:true}"/>                            </td>                        </tr>                        <tr>                            <td>                                <asp:Literal ID="UI_Notes" runat="server" Text="備忘" meta:resourcekey="HandlingFeeNotes" />                            </td>                            <td>                                <textarea id="txtNotes" name="txtNotes" class="text {required:true}" cols="22" rows="2" maxlength="100"></textarea>                            </td>                        </tr>                         <tr>                            <td>                            </td>                            <td>                                <input id="Submit1" type="submit" value="添加處理費"  />                                <asp:Button ID="Button1"  runat="server" Text="添加處理費" OnClientClick="javascript:AddHandlingFeeToRefund()" />                            </td>                         </tr>                    </table>                    </form>