简体   繁体   English

我使用Jquery.ready()不正确吗?

[英]Have I been using Jquery.ready() incorrectly?

With respect to Jquery ready event block, the docs say: 关于Jquery ready事件块,文档说:

The .ready() method is generally incompatible with the attribute. .ready()方法通常与属性不兼容。 If load must be used, either do not use .ready() or use jQuery's .load() method to attach load event handlers to the window or to more specific items, like images. 如果必须使用加载,请不要使用.ready()或使用jQuery的.load()方法将加载事件处理程序附加到窗口或图像等更具体的项目。

and this 和这个

$(function() {
  // Handler for .ready() called.
});

In my coffeescript files for Rails, I tend to follow this pattern: 在我的Rails脚本文件中,我倾向于遵循以下模式:

$ ->
  $("body.controller_name").ready ->
    $(".button_group").change (evt) ->
      alert("do something")

and if I need to delegate a binding for an element that will be created and is not in the initial html, I tend to do this. 如果我需要为将要创建的元素委派一个绑定,并且该绑定不在初始html中,则我倾向于这样做。

$ ->
  $("body.controller_name").ready ->

    $('.button_group').change (evt) ->
      alert("do something")


    $(document).on 'change', '.button_group', (event) ->
      alert("do something")

When checking out turbolinks.jquery gem, I encountered this note: 在检出turbolinks.jquery gem时,我遇到了以下注意事项:

 /* BAD: don't bind 'document' events while inside $()! */
 $(function() {
   $(document).on('click', 'button', function() { ... })
 });

So It leaves me wondering, have I been doing it wrong all along? 所以这让我想知道,我一直做错了吗? Should I avoid using $(document).on() inside the ready block? 我应该避免在ready块中使用$(document).on()吗? If so, other than possible conflict with turbolinks.jquery is there a reason WHY this is wrong? 如果是这样,除了与turbolinks.jquery可能发生冲突以外,还有其他原因为什么这是错误的?

So what is the correct pattern? 那么正确的模式是什么? I familiar with waiting for assets to load by using the load block instead of the ready block, but I'm not sure i'm aware of what I've been doing wrong all this time. 我熟悉使用加载块(而不是就绪块)等待资产加载,但是我不确定我一直都在做什么。

Yes, and no. 是的,没有。

There i no reason to avoid binding events on the document level in the ready event, if you need them. 如果有需要,我没有理由避免在ready事件中在文档级别上绑定事件。

However, you should avoid binding delegates on the document level, if you can help it. 但是,如果可以帮助,应该避免在文档级别上绑定委托。 You should use an element that is as close as possible to the element where the event will occur. 您应该使用尽可能接近将要发生事件的元素的元素。 Whenever the event occurs inside the element where you bound it, it has to check if the element where the event occured matches the selector, so if you bind the delegate on the document level, that work has to be done for every such event occuring anywhere in the page. 每当事件发生在绑定它的元素内部时,它都必须检查事件发生的元素是否与选择器匹配,因此,如果在文档级别绑定委托,则必须为发生在任何地方的每个此类事件完成工作在页面中。

The live method did bind delegates on the document level, and now that method is removed from jQuery and replaced by the delegate method (which is now replaced by the on method), because you should generally bind delegates on a smaller scope. live方法确实在文档级别上绑定了委托,现在该方法已从jQuery中删除,并由delegate方法(现在已由on方法替换)代替了,因为通常应该在较小范围内绑定委托。


The quote from the documentation doesn't talk about what you do in the ready event, it talks about the <body onload=""> attribute. 文档中的引号不涉及您在ready事件中的操作,而是涉及<body onload="">属性。 You shouldn't use that when you are using the ready or load events in jQuery. 在jQuery中使用readyload事件时,不应使用该函数。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM