ajax執行后台返回的提交表單及JS

本文轉載自查看原文 2015-01-21 11:12 3720 Web 前端(Javascript，Html，CSS+DIV)/ ASP.NET

1.在做Ajax請求的時候，有時候會從后台返回拼接好的表單及js代碼，如下，是后台返回的數據：

string result = "<form id='paysubmit' name='paysubmit' action='http://m.pighem.cn/service/rest.htm?_input_charset=utf-8' method='get'><input type='hidden' name='_input_charset' value='utf-8'/><input type='hidden' name='format' value='xml'/></form><script>document.forms['paysubmit'].submit();</script>";
Response.Write(result);

View Code

正如你看到的那樣，上面是后台返回的一個表單及js代碼，那么前端如何來自動執行返回的js代碼呢，Ajax請求如下：

 1 $.ajax({
 2                                     type: "POST",
 3                                     contentType: "application/json",
 4                                     url: "Handler/Handler.ashx?action=SaveTicketsInfos_pay&u=<%=u%>&s=<%=s %>"+"&money="+money+"&xm="+xm+"&mobile=<%=mobile%>&sid="+sid,
 5                                     dataType: 'html',
 6                                     timeout: 30000,
 7                                     async:true,
 8                                     success: function (data2) {
 9                                         loading(false);
10                                         $('body').append(data2);
11                                         return;
12                                 }
13                               });

View Code

這樣只要在body中添加返回的js就可以自動執行了。要注意這里的dataType為html格式的，因為返回的數據是HTML！切記！！

2.如果表單是寫在前端頁面上的，那么在Ajax請求后在后台將表單的數據返回來后，然后在前端手動用js提交表單：

前端代碼：

<body>
    <form id="formTest" runat="server" action="" method="post" enctype="application/x-www-form-urlencoded" rel="external" data-ajax="false" target="_self">
        <input type="hidden" id="serverUrl" runat="server" value="" />
        <input type="hidden" id="version" runat="server" value="1.0" />
</form>
<input type='button' id='btnSubmit' value='提交' onclick='submit();'/>
    </body>
</body>
<script type="text/javascript">
    function submit(){
        $.ajax({
                                type: "POST",
                                contentType: "application/json",
                                url: "Handler/QuickPayHandler.ashx?action=SaveTicketsInfos_Netbank&u=<%=u%>&s=<%=s %>"+"&money="+money+"&xm="+xm+"&mobile=<%=mobile%>&sid="+sid,
                                dataType: 'json',
                                timeout: 30000,
                                async:true,
                                success: function (data2) {
                                    loading(false);
                                    if (data2.exec) {
                                         $("#version").val(data2.version);
                                         $("#serverUrl").val(data2.serverUrl);
document.getElementById("form1").action = "Quick.aspx?s=<%=s%>&u=<%=u%>";                                       document.getElementById("formTest").submit();
                                    }
                                    else{
                                        alert(data2.msg);
                                    }
                                }
                            });
    }
</script>

View Code

PS:如果涉及到多層Ajax嵌套，有時候要注意Ajax請求的async，同步則為false,異步則為true，默認是異步的。

免責聲明！

本站轉載的文章為個人學習借鑒使用，本站對版權不負任何法律責任。如果侵犯了您的隱私權益，請聯系本站郵箱yoyou2525@163.com刪除。

猜您在找 Ajax表單提交及后台處理簡單應用 ajax 前后台數據傳輸 form表單提交 Ajax提交from表單 ajax提交的時候執行多次問題 ajax表單提交執行成功但是沒有執行回調函數，並且post變get了 Jquery ajax方式提交表單 jQuery ajax 提交表單圖片 Ajax和form表單提交區別？ flask使用ajax提交表單關於form表單提交數據后不跳轉頁面+ajax接收返回值的處理