JQuery ajax提交表单的的两种方法
发布时间：2018-08-20 14:45:19 所属栏目：业界 来源：站长网
导读：貌似AJAX越来越火了，作为一个WEB措施开拓者要是不会这个感受就要落后，乃至有也许在求职的时辰屡被裁减。我也是一个WEB措施开拓者，虽然我也要同流合污一把，否则饭碗不保啊! 之前实现AJAX行使 Java script剧本一个一个敲出来的，很繁琐。进修Jquery之后
|
副问题[/!--empirenews.page--]
貌似AJAX越来越火了，作为一个WEB措施开拓者要是不会这个感受就要落后，乃至有也许在求职的时辰屡被裁减。我也是一个WEB措施开拓者，虽然我也要“同流合污”一把，否则饭碗不保啊! 之前实现AJAX行使Javascript剧本一个一个敲出来的，很繁琐。进修Jquery之后就感受实现AJAX并不是那么的坚苦了，虽然除了Jquery框架外尚有其余的优越框架这里我就着重说下较量风行的Jquery。Jquery AJAX提交表单有两种方法，一是url提交，二是form提交。在所要提交的表单中，假如元素许多的话提议用第二种方法举办提交，虽然你要是想练练“打字程度”的话用第一种方法提交也未尝不行，信托开拓者都不想费白劲吧!空话不多说了贴实例。 起主要下载Jquery、Jquery.form这两个插件，网上许多的! 一：Url提交 Copy to Clipboard 引用的内容：[www.veryhuo.com]
<script type ="text/javascript" src ="../js/jquery.js"></script> <script type="text/javascript"> function checkCorpID()//检测客户编号是否可用 { if($.trim($("#txtF_CORPID")[0].value)=="")//txtF_CORPID是客户编号输入框 { alert("请输入客户编号!"); } else { $("#checkFlag").html("正在检测");//表现提醒信息 $.ajax({ type: "POST", url: "CheckCorpID.ashx", data: "ID="+$.trim($("#txtF_CORPID")[0].value),//提交表单，相等于CheckCorpID.ashx?ID=XXX success: function(msg){$("#checkFlag").html("");alert( msg ); } //操纵乐成后的操纵！msg是靠山传过来的值 }); } } </script> 靠山代码： Copy to Clipboard引用的内容：[www.veryhuo.com]
if(context.Request.Params["ID"].ToString()!="") { Pxt.Logic.SYS.CORP_BASE_INFO cbiL = new Pxt.Logic.SYS.CORP_BASE_INFO(); bool flag=cbiL.checkCorpID(context.Request.Params["ID"].ToString()); if (flag) { context.Response.Write("该客户编号已被占用!"); } else { context.Response.Write("该客户编号可用!"); } } 二：Form提交 Copy to Clipboard引用的内容：[www.veryhuo.com]
<script type ="text/javascript" src ="../js/jquery.js"></script> //必必要引用 <script type ="text/javascript" src ="../js/jquery.form.js"></script> //必必要引用 <script type="text/javascript"> // wait for the DOM to be loaded $(document).ready(function() { $('#Tip').hide();//表现操纵提醒的元素不行见 $('#form1').submit(function()//提交表单 { //alert("ddd"); var options = { target:'#Tip', //靠山将把转达过来的值赋给该元素 url:'ReturnVisit.aspx?flag=do', //提交给哪个执行 type:'POST', success: function(){ alert($('#Tip').text());} //表现操纵提醒 }; $('#form1').ajaxSubmit(options); return false; //为了不革新页面,返回false，横竖都已经在靠山执行完了，没事！ }); } ); </script> <body> <form id="form1" runat="server"> <div> <table width="100%" border="0" align="center" cellpadding="0" cellspacing="0"> <tr> <td colspan="2" class="tableCategory">客户回访</td> </tr> <tr> <td width="30%" class="tableBg1">客户名称：</td> <td class="tableBg2"> <asp:TextBox ID="txtF_CorpName" runat="server"></asp:TextBox> </td> </tr> <tr> <td width="30%" class="tableBg1">回访主题：</td> <td class="tableBg2"> <asp:TextBox ID="txtF_ReturnVisitTitle" runat="server"></asp:TextBox> </td> </tr> <tr> <td width="30%" class="tableBg1">接洽人：</td> <td class="tableBg2"> <asp:TextBox ID="txtF_ContractPerson" runat="server"></asp:TextBox> </td> </tr> <tr> <td width="30%" class="tableBg1">接洽人职务：</td> <td class="tableBg2"> <asp:TextBox ID="txtF_ContractPersonPosition" runat="server"></asp:TextBox> </td> </tr> <tr> <td width="30%" class="tableBg1">接洽电话：</td> <td class="tableBg2"> <asp:TextBox ID="txtF_ContractPhone" runat="server"></asp:TextBox> </td> </tr> <tr> <td width="30%" class="tableBg1">回访时刻：</td> <td class="tableBg2"> <asp:TextBox ID="txtF_ReturnVisitDate" runat="server"></asp:TextBox> </td> </tr> <tr> <td width="30%" class="tableBg1">回访内容：</td> <td class="tableBg2"> <asp:TextBox ID="txtF_ReturnVisitContent" runat="server"></asp:TextBox> </td> </tr> <tr> <td width="30%" class="tableBg1">回访相干文档：</td> <td class="tableBg2"> <asp:TextBox ID="txtF_ReturnVisitFile" runat="server"></asp:TextBox> </td> </tr> <tr> <td width="30%" class="tableBg1"> </td> <td class="tableBg2"> <asp:Button ID="Submit_BT" runat="server" Text="确定" CssClass="button" /> <input type="reset" class="button" value="还原" /> </td> </tr> </table> <span id="Tip"></span> </div> </form> </body> （编辑：湖南网） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |
