javascript - 如何根据 AJAX 调用的响应打破 javascript 循环？

Question

我的主题已在这里广泛讨论。我已经搜索了很多并尝试了很多代码，但没有找到任何可以帮助我解决我的具体情况的东西。所以我想向社区提出这个问题。

我正在构建一个包含 12 个表单字段的页面，在其中循环遍历这些字段并进行 AJAX 调用以根据数据库测试值。我的问题是我需要停止循环并根据 AJAX 调用的特定响应获取用户输入。到目前为止，我一直无法停止循环，直到它到达末尾。

这是我的表格:

<form name="claimForm">
<table>
<tr>
<td> <input type="text" id="icdcode1"></td>
<td> <input type="text" id="icdcode2"></td>
<td> <input type="text" id="icdcode3"></td>
<td> <input type="text" id="icdcode4"></td>

</tr>

<tr>
<td> <input type="text" id="icdcode5"></td>
<td> <input type="text" id="icdcode6"></td>
<td> <input type="text" id="icdcode7"></td>
<td> <input type="text" id="icdcode8"></td>

</tr>

<tr>
<td><input type="text" id="icdcode9"> </td>
<td> <input type="text" id="icdcode10"></td>
<td> <input type="text" id="icdcode11"></td>
<td> <input type="text" id="icdcode12"></td>

</tr>

<tr> <td colspan="4"> <input type="button" value="Check IDC Code" onClick="javascript:claimValidate();"></td></tr>
</table>


</form>

<div id="pageresponse"></span>

这是我的 ClaimValidate 函数:

function claimValidate() {

var isFound = false; 
for (i = 1; i <= 12; i++) {

    var icdcode = 'icdcode'+i;

    if (!isFound) {
        if(document.getElementById(icdcode)) {
            var retrieved = document.getElementById(icdcode).value;

                if (retrieved != "") {

                       if (ajaxCheck(retrieved)) {

                        }


                } // end if retrieved

        } // end if document.getElementbyId
    } // end if !isFound    



} // end claimValidate

这是我的 ajaxCheck 函数

function ajaxCheck(icdcode) {

var xmlhttp = new XMLHttpRequest();    

 xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState == 4) {
            //alert(isFound)
            resp = xmlhttp.responseText;

            if (resp == icdcode) {
                return true;
            } else if (resp == "Search Failed") {
                alert("You must enter a valid issue code.")
                return false;
            }  // end if resp

        if ((resp !== "Search Failed") && (resp.length > 0)) { 
                document.getElementById("pageresponse").innerHTML = resp;
                return false;
            }

        } // end readystate

    } // end onreadystatechange

                xmlhttp.open("GET", "validate_idc_code.asp?q=" + icdcode, true);
                xmlhttp.send();

} // end ajaxCheck

我的意图是跳出循环并在到达 ajaxCheck 中的最后一个 if 语句时停止，但事实并非如此，我不确定为什么。我向一位同事展示了我的代码，他似乎认为 ajaxCheck 实际上不会返回任何内容，因为它是在单独的函数中调用的。他建议将我所有的表单字段作为数组传递到我进行数据库检查的 ASP 页面，但我不确定这是最好的解决方案。

如果专家能为我提供任何指导，我将不胜感激。

谢谢!

--克里斯

Answer 1

您可以通过使用全局变量来指示您希望循环继续或停止。然后在 ClaimValidate 中你可以输入类似的内容

if (!loopActive) return;

但这是一个不好的做法。最好的方法是像 @MarcB 和 @JamesThorpe 所建议的那样进行重组。

我只回答了这个想法，因为我明白，为了学习任何东西，你必须首先以不是最好的方式取得进展，然后逐渐理解为什么这不是最佳实践。