我不明白这个 javascript/jquery 代码是如何执行的

Question

如果我删除第一行（alert()），下面的代码将不起作用，很明显我不需要它。我将事件绑定到的表单是使用 jquery 动态生成的。请问可能是什么问题？谢谢。

alert("");
$("#search").autocomplete('func.php');
$("#c_name").autocomplete('func.php');

$("#search").keypress(function(event) {
    if (event.which === 13) {
        findItem('search');
        return false;
    }
});

Answer 1

可能是警报提供了 jQuery 识别所需元素所需的延迟。

删除alert()并在代码周围添加以下内容：

$(document).ready(function(){ ... your code here ... })

Answer 2

该警报为表单加载提供了必要的延迟，之后将事件绑定到元素就有意义了。如果没有警报语句，代码将在表单元素实际加载之前执行。尝试使用 jquery 的 live() 函数将事件绑定到动态加载的元素。以下是如何使用它： http://api.jquery.com/live/

Answer 3

如果在动态创建搜索表单之前调用 $("#search")，则 jQuery 查询将返回 0 个对象，并且无法将事件绑定到任何内容。

对 alert() 的调用会创建一个暂停，允许在进行 $("#search") 查询之前创建表单。您可以通过在使用和不使用第一个 alert() 的情况下对 $("#search") 的结果进行 alert 来确认这一点。

在尝试将任何事件绑定到搜索表单之前，您必须确保已创建搜索表单。如果这不是微不足道的事情，您可以考虑使用 jQuery 1.5+ 延迟对象 。延迟对象可用于确保在将事件绑定到搜索表单之前创建搜索表单。

Answer 4

您需要将其包装在 $(document).ready 中：

$(document).ready(function(){
  $("#search").autocomplete('func.php');
  $("#c_name").autocomplete('func.php');

  $("#search").keypress(function(event) {
      if (event.which === 13) {
          findItem('search');
          return false;
      }
  });
});