用于ajax页面的javascript

Question

我只是想弄清楚ajax页面的javascript应该放在哪里。例如，在我的页面中，一旦页面加载，我就会发出一个ajax请求并检索20条记录，每条记录由大约10个div组成，其中包含一些自己的按钮和操作。

现在，对于新加载的元素的 ajax 和客户端 js 操作，必须将 js 放入父函数的回调中才能正常工作，但这变得很困惑，因为我对新加载的元素有大约 15 个操作控制。

将所有代码与返回的 ajax 页面放在一起非常容易。

这就是我从初始请求返回的内容

 <div id="something">
 <input type="button" id="btn1">
 <input type="button" id="btn2">
 <input type="button" id="btn3">
 </div>

如果我嵌入这些元素各自的 js jquery 代码以及返回的结果，它工作正常。

 $("#btn1").click(blah)
 $("#btn2").click(blah)
 $("#btn3").click(blah)

问题是，这样做可以吗？

Answer 1

使用$.live()方法将事件逻辑添加到页面生命周期中稍后添加的项目。

$(":button").live("click", function(){
  // This works on all buttons loaded asynchronously too
  alert( "You clicked button #" + $(this).index() );
});

在线演示:http://jsbin.com/obapej/edit