jquery的bind跟on繫結事件的區別

2021-09-22 12:27:42 字數 798 閱讀 7164

jquery的bind跟on繫結事件的區別:主要是事件冒泡;

jquery文件中bind和on函式繫結事件的用法:

.bind(events [,eventdata], handler)

.on(events [,selector]  [,data], handler)

從文件中可以看出,.on方法比.bind方法多乙個引數'selector'

.on的selector引數是篩選出呼叫.on方法的dom元素的指定子元素,如:

$('ul').on('click', 'li', function())就是篩選出ul下的li給其繫結click事件;

那麼這個selector引數的好處是什麼?

好處在於.on方法

原理是事件冒泡,進行事件委託,子元素把事件委託給父元素進行事件處理;

這樣的好處 

1.萬一子元素非常多,給每個子元素都新增乙個事件,會影響到效能;

2.為動態新增的元素也能綁上指定事件;

如:

$('ul li').on('click', function())
的繫結方式和

$('ul li').bind('click', function())
一樣;我通過js給ul新增了乙個

這個新加的li是不會被綁上click事件的

但是我用

$('ul').on('click', 'li', function()
方式繫結,然後動態新增

這個新生成的li被綁上了click事件

jquery的bind跟on繫結事件的區別

jquery的bind和on繫結事件的區別 bind和on的繫結事件的區別 jquery文件中bind和on函式繫結事件的用法 bind events eventdata handler on events selector data handler 從文件中可以看出,on方法比.bind方法多乙個...

jquery的bind跟on繫結事件的區別

jquery的bind跟on繫結事件的區別 主要是事件冒泡 jquery文件中bind和on函式繫結事件的用法 bind events eventdata handler on events selector data handler 從文件中可以看出,on方法比.bind方法多乙個引數 selec...

jquery的bind跟on繫結事件的區別

jquery的bind跟on繫結事件的區別 主要是事件冒泡 jquery文件中bind和on函式繫結事件的用法 bind events eventdata handler on events selector data handler 從文件中可以看出,on方法比.bind方法多乙個引數 selec...