Question

我有以下脚本，只要是静态html

就可以使用

$('li.tab').each(function(index) {
    $("#tab" + index ).click(function() {$("#tabs").tabs( "select" , index  );});
});

这就是静态html的样子：

<div class="item" id="tab0"><div class="icon" style="background-image: url('http://intranet/icon0.png');"></div> Default</div>
<div class="item" id="tab1"><div class="icon" style="background-image: url('http://intranet/icon1.png');"></div> Reports</div>
<div class="item" id="tab2"><div class="icon" style="background-image: url('http://intranet/icon2.png');"></div> Other</div>

如果我使用数据库通过jquery / ajax生成3个html行，我是否必须使用jquery live函数来连接上面脚本中的click事件外观？

如果是，我该怎么做？

Answer 1

是的，您需要使用 live

$('li.tab').each(function(index) {

  $("#tab" + index).live('click', function() {
    // ...
  });

});

Answer 2

$('.your_target_class').live('click', function () {
    //your code here.
});

Answer 3

使用.delegate（）代替.live（），它绑定到围绕您所定位的对象。你可以链接.delegate（）加上它更好的性能（你可以在这里查找http://jquerybyexample.blogspot.com/2010/08/bind-vs-live-vs-delegate-function.html）

另外，不要忘记使用.die（）/。undelegate（），否则你冒着触发多个请求的风险（即，如果多次调用你的.live（）声明，你的点击事件会多次开火。你可以在这里查看jQuery UI ajax tabs - requests multiplying when loading links within tabs）

请注意，jQuery 1.4.2在它的.live（）中有一个错误，考虑到这一点。

使用jquery live点击事件

3 个答案: