在開發過程中,經常會遇到jQuery的on()事件沒有觸發的情況,這是因為on()事件存在一些細節問題。
首先,當我們使用on()事件添加一個監聽器時,我們必須確保元素已經存在于頁面上,否則on()事件將無法正常工作。比如,在一個動態生成的元素上使用on()事件,我們必須將on()事件綁定到該元素生成的父元素上,如下面的代碼:
$(document).on('click', '#dynamic-ele', function(){ // ... });
其次,當我們需要對多個元素進行事件監聽時,我們不能使用逗號分隔它們,而應該使用空格分隔它們。比如,下面的代碼是錯誤的:
$('.ele1', '.ele2').on('click', function(){ // ... });
應該使用下面的代碼:
$('.ele1 .ele2').on('click', function(){ // ... });
最后,當我們需要在運行時動態添加或刪除一個監聽器時,我們應該使用on()事件的事件委托機制,將監聽器綁定到一個靜態的父元素上,如下所示:
$('body').on('click', '#dynamic-ele', function(){ // ... });
總之,要確保元素已經存在于頁面上、使用空格而不是逗號分隔多個元素、使用事件委托機制,就可以解決jQuery的on()事件不觸發的問題。