javascript - JQuery的执行顺序，同步问题

Question

这似乎是一个非常基本的问题，但我可以弄清楚如何确保在检查 HTML 元素之前执行 jquery。我有一个循环来进入搜索栏并阅读结果并检查搜索词是否返回任何内容。

除了 if 结构甚至在单击搜索按钮之前检查元素外，这做了我想要的。我运行扩展程序的网站是 https://www.avnet.com/wps/portal/us

var searchTerms = ["internal", "null?","random", "asdfsadfa", "relay"];

var i;
for (i = 2; i < searchTerms.length; i++) {
    var curTerm = searchTerms[i];
    $('#searchInput').val(curTerm);
    $('.input-group-addon').click();
    if($(".avn-noresultspage-main-section")[0]){
        $(".avn-noresultspage-main-section").css( "border", "10px solid red" );
        alert('This is a Null!');
    }else{
        alert('Not a Null!');
    } 
}

因此，通过一些谷歌搜索，我发现链接/回调函数是可行的方法。 Callback function example所以我在 jquery 中单击后调用了检查元素函数。但现在什么也没有发生。我刚刚运行了 for 循环，最后一次点击甚至没有执行？

我应该如何正确地链接我的操作？

var searchTerms = ["internal", "null?","random", "asdfsadfa", "relay"];

var i;
for (i = 2; i < searchTerms.length; i++) {
    var curTerm = searchTerms[i];
    $('#searchInput').val(curTerm);
    $('.input-group-addon').click(function() {
      if($(".avn-noresultspage-main-section")[0]){
        $(".avn-noresultspage-main-section").css( "border", "10px solid red" );
        alert('This is a Null!');
      }else{
        alert('Not a Null!');
      }
    } );
}

更新:我确实尝试使用超时功能，但我似乎也卡住了点击的执行。

var searchTerms = ["internal", "null?","random", "asdfsadfa", "relay"];

var i;
for (i = 2; i < searchTerms.length; i++) {
    var curTerm = searchTerms[i];

    setTimeout(function() {
        $('#searchInput').val(curTerm);
        $('.input-group-addon').click();
    }, (3 * 1000));
    if($(".avn-noresultspage-main-section")[0]){
        $(".avn-noresultspage-main-section").css( "border", "10px solid red" );
        alert('This is a Null!');
    }else{
        alert('Not a Null!');
    } 
}

点击后有延迟的方法吗？

Answer 1

你修改后的代码在代码逻辑上肯定是不一样的。语法 .click(function) 用于为“click”事件添加/修改事件处理程序。为了让它像第一个版本一样工作，你需要在它之后添加一个链式触发器，比如 click(function(){...}).click(); 而检查代码在点击事件触发之前执行的原因是，搜索事件可能是一个AJAX事件，当你触发点击时，Javascript只会“点击”并执行检查代码，而不会等待搜索事件返回结果。你应该使用:

  $(document).ajaxSuccess(function(){
         //checking code here
});

但它适用于该站点上的所有 ajax 事件，所以我认为最好的解决方案是您应该添加一个超时等待检查代码，以确保我们返回搜索结果。