使用同一个Js文件渲染页面数据和绑定事件产生的异步问题

Question

页面数据使用$.ajax()获得，使用template.js渲染到页面上，通过引用另一个html文件（绑定事件的按钮也在这个文件中）

然后我在ajax方法之后给button绑定click事件，发现找不到元素，因为button还没渲染出来。

现在的解决办法是给click套了一个setTimeout()，1s后执行，功能上没问题，就是太简陋了。

请问还能通过什么方法实现？

Answer 1

使用冒泡

$("body").on("click", "button", function(){
    // do something
})

Answer 2

可以参考我写的jQTips·动态添加元素的清爽写法，整好有怎么绑click事件的部分~

Answer 3

判断一下，等到button加载出来再去绑定事点击事件

Answer 4

可以尝试用 Promise。
参考：http://liubin.org/promises-book/

比较简单可以在 ajax 加上 complete callback 来处理 按钮 click 绑定。

Answer 5

<button onclick="test*()">我是按钮</button>
function test(){

do someting...

}
注意test函数的位置，作用域问题。。应该可以