jQuery on（）不適用於Chrome，Safari。在Firefox中工作

Question

我有一個頁面，您可以點擊某個日曆日（例如星期一的第一天），並且它會在頁面其他地方的div中的某些課程時間加載ajax，並將每個div都包含在一個名爲timeSpan的類中。然後我讓用戶點擊其中一個時間點（突出顯示它）來選擇一個。這在Firefox中效果很好，但我今天發現它在Safari或Chrome中無法使用。還沒有試過IE，因爲我在Mac上。這是代碼：

jQuery.root.on("click", ".timeSpan", function(event) { 

我已經把它作爲.delegate（）而不是.on（）並且工作得很好。然後我在這裏搜索並找到了使用.on的建議，所以我換了。仍然適用於FF，但不適用於其他任何東西。我使用jQuery 2.1.4，但如果需要，我可以更改。

這是呈現時間跨度的div行：

html+= "<div class='timeSpan' data-classdate='" + class_date + class_date_endTime + "' data-date='" + class_date2 + "' data-eventid='" + eventid + "'>" + the_date + ",<br>" + start_time + " to " + end_time + "</div><br>"; 

任何想法如何解決這一問題？謝謝！

Answer 1

由於您正在動態生成html，因此您需要將單擊事件委派給文檔。

html+= "<div class='timeSpan' data-classdate='" + class_date + class_date_endTime + "' data-date='" + class_date2 + "' data-eventid='" + eventid + "'>" + the_date + ",<br>" + start_time + " to " + end_time + "</div><br>"; 

$(document).on("click", ".timeSpan", function(event) { // delegates the click event on the dom and during event invocation checks class timespan 

});