我剛剛閱讀了一些關於使用on()
將事件附加到動態創建的html元素的線程。我想出了這個例子(FIDDLE)嘗試將click
事件綁定到通過AJAX返回的元素div.clicktitle
。 div元素具有數據屬性,點擊事件應從該屬性獲取值並顯示它們。但它似乎沒有工作。on()點擊以將事件綁定到AJAX返回的元素
對我的工作是定義click
事件函數並將其放入Ajax成功回調函數中。 (FIDDLE)這是使click事件與AJAX返回元素一起工作的唯一方法嗎?誰能告訴我爲什麼.on()
不附加到div.clicktitle
事件?
HTML前阿賈克斯
<div class="main"></div>
<div class="second"></div>
阿賈克斯後,它應該是
<div class="main"><div data-source="Hello" class="clicktitle"><h6>Title1</h6></div></div>
<div class="second"><div data-source="Hello" class="clicktitle"><h6>Title2</h6></div></div>
JS代碼:
$.ajax({
url: "https://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20rss%20where%20url%3D%22https%3A%2F%2Fnews.google.com%2F%3Foutput%3Drss%22&format=json&diagnostics=true&callback=",
success: function (data) {
var length = 0;
var items = data.query.results.item;
items = items.map(function(item){
return '<div data-source="Hello" class="clicktitle"><h6 style="background:beige;">'+item.title+'</h6></div>';
});
var half = items.length/2;
for(var i = 0; i < items.length; i++)
if(i < half)
$('.main').append(items[i]);
else
$('.second').append(items[i]);
length++;
},
error: function() {}
});
$('.clicktitle').on("click",function(){
var datasource = $(this).data('source');
$(this).text(datasource);
});
請直接在問題中提供您的「嘗試」。你在濫用。我確信至少有一個你讀過的問題涵蓋了這個問題。 –
我相信這會起作用:$(document).on(「click」,「.clicktitle」,function(){...}) – Alen