JQUERY 一問 $('.smt').on('click',function(){}) 和 $(document).on('click','.smt',function(){ 的分別

jquery

samkwok123 2020-09-02 23:36:47 ‧ 997 瀏覽

自學小白想問一下兩者的分別
$('.stm').on('click',function(){

});
$(document).on('click','.stm',function(){

});
感激流涕@~@

直播研討會

{{ item.channelVendor }} {{ item.webinarstarted }} |

直播中

暐翰

iT邦大師 1 級 ‧ 2020-09-02 23:53:01

最佳解答

$(document).on('click','要選擇的元素',function(){})
　　 on方法包含很多事件，點擊，雙擊等等事件。和$().click()的用法一樣，最大的區別即優點> 是如果動態創建的元素在該選擇器選中範圍內是能觸發回調函數。
...動態添加的元素也能被點擊觸發函數

japhenchen

iT邦超人 1 級 ‧ 2020-09-03 07:29:59

on用在靜態及動態產生的頁面內容都有效
而.click只對靜態頁面內容有效( 在$(document).ready() 之前就已存在的內容 )

㊣浩瀚星空㊣

iT邦大神 1 級 ‧ 2020-09-03 09:26:13

兩者其實都是相同的效果。差別在於生效的的事件不同。

$('.stm').on 這種寫法很容易發生失效的情況。

其實如果是在jquery 1.7之前。
還沒有第二種寫法。

當時我映像是因為效能的問題。
好像之前的寫法是將事件直接寫到 document 對應(還是往上級綁定?不太記得了)。造成效能非常不好。
在 1.9 版才出現子元件的宣告方式。

畢竟 document 不可能會消失不見。

認真來說，on的宣告是採用event bubbling 事件冒泡對應。
這樣才能做到動態事件處理。

立即登入回答