javascript - 通過ajax,在ul加載了全部數(shù)據(jù),添加了ul li 單擊事件,可是觸發(fā)不了。
問題描述
通過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); //添加全部城市 }}); });
實現(xiàn)圖
標簽
<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>
事件
/*選擇一個省 ,li[class=’com-li gj_dispro’] 觸發(fā)不了*/ $('ul[class=’com-ul com-ul-288’]').click(function(){ alert(1); // 不明白為什么 ul 能觸發(fā),li就不行,//請教一下如何獲取到選擇中l(wèi)i的省市和id });
問題解答
回答1:$(’selector’).on(’click’,’childSelector’,function(){})使用 on() 方法添加的事件處理程序適用于當前及未來的元素回答2:
因為ajax事件是異步執(zhí)行的,你點擊的時候,并沒有l(wèi)i這個don結(jié)構(gòu)
回答3:循環(huán)時把id存在li的attr里<li c_id='' >點擊事件 獲取var cid = $this.attr(’c_id’);
回答4:使用$parentNode.on(’click’,childNode,callback)來綁定事件 原理就是事件冒泡機制
回答5:注意三點:1.事件注冊函數(shù)應(yīng)該在Ajax調(diào)用成功后再注冊,可以在ajax的回調(diào)函數(shù)中調(diào)用事件注冊函數(shù),2.確保你的注冊事件的函數(shù)未寫錯,你這兒事件函數(shù)寫錯了,直接給click賦值,然后是你的class選擇器,沒發(fā)現(xiàn)有元素的class值是你選擇器中的值,如果沒有當然選不到。3.確保在你點擊事件之前,確保事件已經(jīng)注冊完成。
