相关疑难解决方法(0)

我正在使用jQuery v.1.7.1,其中.live()方法显然已被弃用.

我遇到的问题是,当使用以下方法动态将html加载到元素中时:

$('#parent').load("http://..."); 

如果我之后尝试添加click事件,则不会使用以下任一方法注册事件:

$('#parent').click(function() ...); 

要么

// according to documentation this should be used instead of .live()
$('#child').on('click', function() ...); 

实现此功能的正确方法是什么？它似乎只适用于.live(),但我不应该使用该方法.请注意,#child是动态加载的元素.

谢谢.

这是来自哪里

当我第一次学习jQuery时,我通常会附加这样的事件:

$('.my-widget a').click(function() {
    $(this).toggleClass('active');
});

在了解了有关选择器速度和事件委托的更多信息之后,我在几个地方读到"jQuery事件委托将使您的代码更快".所以我开始编写这样的代码:

$('.my-widget').on('click','a',function() {
    $(this).toggleClass('active');
});

这也是复制已弃用的.live()事件行为的推荐方法.这对我很重要,因为我的很多网站都在动态添加/删除小部件.上面的行为与.live()的行为完全不同,因为只有添加到现有容器".my-widget"的元素才会获得行为.如果我在代码运行后动态添加另一个html块,那么这些元素将不会获取绑定到它们的事件.像这样:

setTimeout(function() {
    $('body').append('<div class="my-widget"><a>Click does nothing</a></div>');
}, 1000);

我想要实现的目标:

1. .live()的旧行为//意味着将事件附加到尚未存在的元素
2. .on()的好处
3. 绑定事件的最快性能
4. 管理事件的简单方法

我现在附上所有这样的事件:

$(document).on('click.my-widget-namespace', '.my-widget a', function() {
    $(this).toggleClass('active');
});

这似乎符合我的所有目标.(是的,因为某种原因它在IE中速度较慢,不知道为什么？)它很快,因为只有一个事件与单个元素相关联,而二级选择器仅在事件发生时进行评估(如果这里错误,请纠正我).命名空间非常棒,因为它可以更容易地切换事件监听器.

我的解决方案/问题

所以我开始认为jQuery事件应该始终绑定到$(document).
你有什么理由不想这样做吗？
这可算是最佳做法吗？如果没有,为什么？

如果您已经阅读了这一切,谢谢.我感谢任何/所有反馈/见解.

假设:

1. 使用支持.on()//至少1.7版的jQuery
2. 您希望将事件添加到动态添加的内容中

读数/例子:

1. http://24ways.org/2011/your-jquery-now-with-less-suck
2. http://brandonaaron.net/blog/2010/03/4/event-delegation-with-jquery
3. http://www.jasonbuckboyer.com/playground/speed/speed.html
4. http://api.jquery.com/on/

jQuery有一个所谓的新方法on()被建议更换delegate(),live()和.bind().

例如,使用两种方法:

$('#some-button').on('click', function() {
    //do something when #some-button is clicked
});
$('#some-button').live('click', function() {
    //do something when #some-button is clicked
});

哪一个表现更好？(我知道这两个事件上下文都在文档级别.)