2

我在 jquery onready 函数之外编写 jquery onclick 事件。如果我在 jquery onready 函数中编写 onclick 函数，它以什么方式不同于执行流程？

例如： 

  1. jQuery(document).ready(function(){

  });
 jQuery("#elementid").click(function(){
  });

2.  jQuery(document).ready(function(){
    jQuery("#elementid").click(function(){
  });

  });

1和2的执行流程有什么不同。哪一种是使用实时的最佳方式？
提前致谢。

4

5 回答 5

2

第二个更好。第一个有时可能不起作用，因为您可能正在选择尚未加载的元素。通过包含在文档就绪处理程序中，您可以确保所有页面元素在您引用它们之前都已加载。

更普遍...

// code that does not interact with DOM can go here, and will be executed
// before the has DOM finished loading.
jQuery(document).ready(function(){
  // code that needs to access the page elements/DOM goes here, and will execute
  // after the DOM has finished loading
})
于 2013-04-22T09:32:29.197 回答
1

如果您在 DOM-ready 函数之外#elementid定义处理程序，则选择器可能会返回一个空值 - 如果您等待整个 DOM 被加载，您将是安全的。

另一方面，您可以将处理程序委托给文档：

$(document).on('click', '#elementid', function(event){ ... });

document这样，就在单击元素时，整个事件将被整个监听#elementid- 但这当然会更昂贵。

于 2013-04-22T09:35:29.830 回答
0

在第一种情况下，在 DOM 准备好之前不会执行代码。

见http://api.jquery.com/ready/

The handler passed to .ready() is guaranteed to be executed after the DOM is ready, so this is usually the best place to attach all other event handlers and run other jQuery code.

如果您在script位于 HTML 开头或标题中的元素中执行第二个代码，则不会找到按钮元素并且不会绑定任何事件处理程序。使用.ready修复。

出于同样的原因，将脚本放在页面底部（与 相邻）也可以解决此问题 - 解析脚本时，HTML 将转换为 DOM，您可以遍历它。

于 2013-04-22T09:42:49.503 回答
0

在 onready 中编写事件处理程序总是更安全，因为否则可能会在将所需元素添加到 dom 之前执行您的脚本

于 2013-04-22T09:33:14.987 回答
0

如果你想让一个事件在你的页面上工作，你应该在$(document).ready()函数内部调用它。这是为了确保您的所有元素都已添加到 DOM 并准备好使用。

也来自这个文档：

$(document).ready() 函数比其他让事件生效的方法有很多优势。首先，您不必在 HTML 中放置任何“行为”标记。您可以将所有 JavaScript/jQuery 分离到一个单独的文件中，这样更易​​于维护并且不会影响内容

使用 $(document).ready()，您可以让事件加载或触发，或者在窗口加载之前让它们执行任何操作。您插入括号内的所有内容都已准备好尽快使用——只要浏览器注册了 DOM，当用户第一次看到页面元素时，它就可以立即进行一些很好的隐藏和显示效果和其他内容

于 2013-04-22T09:33:34.643 回答