WEB开发网
开发学院网页设计JavaScript jquery ajax提交表单数据的两种方式 阅读

jquery ajax提交表单数据的两种方式

 2009-11-25 00:00:00 来源:WEB开发网   
核心提示: 二:Form提交数据前台代码:<scripttype="text/javascript"src="../js/jquery.js"></script>//必须要引用<scripttype="text/javascri

二:Form提交数据

前台代码:

<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>

Tags:jquery ajax 提交

编辑录入:爽爽 [复制链接] [打 印]
赞助商链接