Question

在使用ajax进行编码时，我发现了一个问题。以下是我的代码片段。

<script type="text/javascript">
    function xmlHttp(){
        if(window.XMLHttpRequest){
            xmlhttp = new XMLHttpRequest();
        }
        else{
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        }
        return xmlhttp;
    }

    function addData(a, b, c){
        xmlhttp = xmlHttp();
        xmlhttp.onreadystatechange = function(){
            if(xmlhttp.readyState==4 && xmlhttp.status==200){
                alert("Response : " + xmlhttp.responseText);
            }
        }
        link = "test.php?a="+a+"&b="+b+"&c="+c;
        xmlhttp.open("GET",link,true);
        xmlhttp.send();
    }
</script>
<center>
    <form method="POST" action="?page=search.php">
        <table width="400" border="1">
            <tr>
                <td align="right"><button onclick="return addData(1,2,3);">Add data</button></td>
            </tr>
        </table>
    </form>
</center>

点击按钮，ajax请求调用。在ajax请求完成之前，会发生提交。在ajax请求完成之前，应该等待表单提交。

我发现此链接与我的相似。 Sending an Ajax request before form submit

这样做，我的其他表格不会被发送（其他输入类型）。 POST数组仍为空。

Answer 1

如果您希望用户在AJAX请求完成之前不提交表单，您可以在发送请求时禁用表单，并在收到响应后启用它。您可以另外显示一个loading ... gif来告诉用户正在发生的事情。

更新：您可以这样写。您需要做的是将SubmitBtnId替换为提交按钮的ID。

<script type="text/javascript">
    function xmlHttp(){
        if(window.XMLHttpRequest){
            xmlhttp = new XMLHttpRequest();
        }
        else{
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        }
        return xmlhttp;
    }

    function addData(a, b, c){
        xmlhttp = xmlHttp();
        xmlhttp.onreadystatechange = function(){
            if(xmlhttp.readyState==4 && xmlhttp.status==200){
                alert("Response : " + xmlhttp.responseText);
                Document.getElementById('SubmitBtnId').disabled=false;
            }
        }
        link = "test.php?a="+a+"&b="+b+"&c="+c;
        Document.getElementById('SubmitBtnId').disabled=true;
        xmlhttp.open("GET",link,true);
        xmlhttp.send();
    }
</script>

停止表单请求，直到ajax请求完成

1 个答案: