一些jquery代码不起作用，而另一些则正常

debugcn 发表于 Dev

伊克巴尔·穆罕默德·里德万（Iqbal Mohammad Rhidwan）

我正在尝试将功能绑定到click事件。一切工作正常，但该功能的某些行未执行，而其他行则完全按照我的要求运行。

$("#search").click(function(event){
    event.preventDefault();
    $("#search").prop("disabled", true); //not working
    $('#search-help').show(); //not working
    $('#search-help').text("Please wait while we are processing your request");//not working
    update_access_from_refresh(); //working fine
    ...
    do_search_ajax();
    // this function works just fine.
    ...
    $("#asin").removeClass("is-invalid"); //working
    $("#keywords").removeClass("is-invalid"); //working
    $("#search").prop("disabled", false); //I don't know its working
    $('#search-help').hide(); // I don't know its working
});

在这里，我评论了行不通的代码。

这行代码行不通，如果我从chrome控制台运行此行，则一切正常。但是从功能来看，它不起作用。

这是相关的HTML代码。我认为HTML并不是问题。原因是从控制台运行代码时，它工作正常。但是不能从功能上工作。

<form class="search-form">
              <div class="form-row">
                <div class="form-group col-md-3">
                    <button type="submit" id="search" class="btn btn-block btn-secondary mb-2">Search</button>
                </div>
                   ...
                <div class="mr-auto ml-auto">
                    <span  class="text-info" id="search-help" style="display: none;"></span> 
                </div>
              ...
          </form>

一些代码是从html中摘录的。

我查看了页面源代码，该代码也是最新的。

提前致谢

Medet Tleukabiluly

调用ajax后应该执行操作

function do_search_ajax () {
  return fetch('https://jsonplaceholder.typicode.com/todos/1')
    .then(response => response.json())
}
$("#search").click(function(event) {
  event.preventDefault();
  $("#search").attr("disabled", true); // working
  $('#search-help').show(); //not working
  $('#search-help').text("Please wait while we are processing your request"); //not working

  do_search_ajax().then(json => {
      console.log(json)
      $("#asin").removeClass("is-invalid"); //working
      $("#keywords").removeClass("is-invalid"); //working
      $("#search").prop("disabled", false); //I don't know its working
      $('#search-help').hide(); // I don't know its working
    })
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<form class="search-form">
  <div class="form-row">
    <div class="form-group col-md-3">
      <button id="search" class="btn btn-block btn-secondary mb-2">Search</button>
    </div>
    ...
    <div class="mr-auto ml-auto">
      <span class="text-info" id="search-help" style="display: none;"></span>
    </div>
    ...
</form>

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。