问题原因
当我们使用jq的时候,会遇到这种情况:我们加载完了页面后,需要通过Jq来动态添加一些元素并绑定事件。
举个栗子:
var newnode=document.createElement("div");
newnode.innerHTML="<button onclick='ok()'>确定</button>"
$("#xxx").appendChild(newnode);
当我们这样添加元素并且绑定onclick事件的时候是无效的。
会报错ok is not defined。
这是因为页面在加载完成的时候,事件已经绑定了,你动态添加的元素无法绑定事件,这个时候就需要手动绑定。
问题解决
事件委托
- 动态添加直接写$(document)
$(document).on('click','.wc-but-js',function(){ //.wc-but-js是class
alter("123123");
});
- 指定父元素
$(“#xxx”).on('click','.wc-but-js',function(){ // #xxx 是父元素id
alter("123123");
});