問(wèn)題描述

通過(guò)ajax,在ul加載了全部數(shù)據(jù)，添加了ul li 單擊事件,可是觸發(fā)不了，如果是ul事件的話能觸發(fā)。

ajax

/*省市*/$('#proNum').click(function(){$.ajax({type:'post', url:'region/jsonRegion', dataType:'json', success:function(data){ $('#gj_disProvince').toggleClass('active');var listr ='';for(var i = 0; i < data.length; i++){ listr +='<li class=’com-li gj_dispro’ proNum=’'+data[i].id+'’>'+data[i].placename+'</li>';}$('#assessPro').html(listr); //添加全部城市 }}); });

實(shí)現(xiàn)圖

標(biāo)簽

<p id='gj_disProvince'> <input readonly='readonly'placeholder='省份' proNum='0'> <p class='p-r'><p class='down-box'> <ul id='assessPro'> </ul></p> </p></p>

事件

/*選擇一個(gè)省 ，li[class=’com-li gj_dispro’] 觸發(fā)不了*/ $('ul[class=’com-ul com-ul-288’]').click(function(){ alert(1); // 不明白為什么 ul 能觸發(fā),li就不行,//請(qǐng)教一下如何獲取到選擇中l(wèi)i的省市和id });

問(wèn)題解答

$(’selector’).on(’click’,’childSelector’,function(){})使用 on() 方法添加的事件處理程序適用于當(dāng)前及未來(lái)的元素回答2：

因?yàn)閍jax事件是異步執(zhí)行的，你點(diǎn)擊的時(shí)候，并沒(méi)有l(wèi)i這個(gè)don結(jié)構(gòu)

循環(huán)時(shí)把id存在li的attr里<li c_id='' >點(diǎn)擊事件 獲取var cid = $this.attr(’c_id’);

使用$parentNode.on(’click’,childNode,callback)來(lái)綁定事件 原理就是事件冒泡機(jī)制

注意三點(diǎn):1.事件注冊(cè)函數(shù)應(yīng)該在Ajax調(diào)用成功后再注冊(cè)，可以在ajax的回調(diào)函數(shù)中調(diào)用事件注冊(cè)函數(shù)，2.確保你的注冊(cè)事件的函數(shù)未寫(xiě)錯(cuò)，你這兒事件函數(shù)寫(xiě)錯(cuò)了，直接給click賦值，然后是你的class選擇器,沒(méi)發(fā)現(xiàn)有元素的class值是你選擇器中的值，如果沒(méi)有當(dāng)然選不到。3.確保在你點(diǎn)擊事件之前，確保事件已經(jīng)注冊(cè)完成。