javascript - 關于動態加載后再綁定事件,事件不起作用的提問
問題描述
我在ajax動態創建了三個p盒子之后,再給盒子綁定點擊事件為什么不起作用?只有在ajax創建的時候 同時給他 綁定事件才有用?這樣就綁定了三遍,這是為什么呢?有沒有更優的辦法?
問題解答
回答1:比如你可以看看jquery實現
$('#a').click(callback);
$(document).on(’click’,’#a’,function(){ //TODO });
$('#a').live();//過時回答2:
$(document).on(’click’,’#a’,function(){ //TODO }); 借一樓回答的 感覺可以 先找到他父元素再綁定
回答3:這個我以前碰過,動態加載的DOM用onclick是不起作用的,因為只對存在的dom起作用,用$(document).on(’click’,’#a’,function(){})才行,你可以試試看。
回答4:你可以用事件委托來實現,就比如說
<p class='wrapper'></p>
你想在wrapper里面添加一個列表(.list),委托你可以這樣寫(簡單寫法):
//獲取目標節點(這里只支持class獲取)//ele: 起始元素,最內側的元素//selector: className,//stopTrget: 委托容器元素function getTargetNode(ele,selector,stopTarget){ var clsReg = new RegExp(selector),className = ele.className; if(ele === stopTarget) return null; if(clsReg.test(className)){return ele; } else {return getTargetNode(ele.parentNode,selector); }};//委托function addEvent(event,ele,selector){ ele['on'+event] = function(e){e = e || event;var target = e.target || e.srcElement;//當滿足觸發條件時if(getTargetNode(target,selector,ele)){ //The deep♂dark♂fantasy} };}addEvent('click',document.querySelecor(’.wrapper’),’.list’);回答5:
用JQ的on方法和delegate方法都可以,原生的話用事件委托
