使用jquery .live()来处理当前和未来的DOM

Question

我把我的jQuery代码作为

$('#tarea').click(function() {
     // Do stuffs
});

这适用于与此脚本一起加载的#tarea按钮.如果将来使用ajax加载按钮#tarea,则上述代码不起作用.

现在我将代码更改为

$('#tarea').live('click', function() {
     // Do stuffs
});

这次,#tarea按钮与脚本一起加载不起作用.但是如果使用ajax生成,则脚本可以使用该按钮.

我如何编写脚本,以便在这两种情况下,它的工作原理？

Answer 1

.live()在这两种情况下均可使用,而无需执行任何其他操作.我会检查代码中可能阻止这种情况发生的其他一些问题.

重要提示:要检查的一件事是确保您的.live()事件受到约束,并且它不依赖于其他事件发生.发布JavaScript文件的重要部分可能会有所帮助.就个人而言,我喜欢在.live()全球范围内宣布我的活动.

我做这样的事情:

// this is what I mean by global because it is outside the document.ready
$("#test").live("click", function() {
    // do stuff
});

$(function() {
    // do stuff when document is ready
});

如果您想证明我上面所说的内容,您只需将按钮和.live()JavaScript代码放在新的HTML文件中即可.