Nachdem ich mit Ajax drei P-Boxen dynamisch erstellt habe, warum funktioniert es dann nicht, wenn ich Klickereignisse an die Boxen binde? Ist es nur sinnvoll, Ereignisse an ihn zu binden, wenn Ajax erstellt wird? Dadurch wird es dreimal gebunden. Gibt es einen besseren Weg?
比如你可以看看jquery實現(xiàn)
$("#a").click(callback);
$(document).on('click','#a',function(){ //TODO });
$("#a").live();//過時
$(document).on('click','#a',function(){ //TODO }); 借一樓回答的 感覺可以 先找到他父元素再綁定
這個我以前碰過,動態(tài)加載的DOM用onclick是不起作用的,因為只對存在的dom起作用,用$(document).on('click','#a',function(){})才行,你可以試試看。
你可以用事件委托來實現(xiàn),就比如說
<p class="wrapper">
</p>
你想在wrapper里面添加一個列表(.list),委托你可以這樣寫(簡單寫法):
//獲取目標(biāo)節(jié)點(這里只支持class獲取)
//ele: 起始元素,最內(nèi)側(cè)的元素
//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;
//當(dāng)滿足觸發(fā)條件時
if(getTargetNode(target,selector,ele)){
//The deep♂dark♂fantasy
}
};
}
addEvent("click",document.querySelecor('.wrapper'),'.list');