jquery中,bind的意思為“綁定”,用于給指定元素綁定事件,并設(shè)置事件發(fā)生時(shí)運(yùn)行的處理函數(shù);語法“元素對(duì)象.bind(event,data,function)”,參數(shù)event規(guī)定需要綁定到元素上的事件,可有多個(gè)值,但需使用空格分隔。
本教程操作環(huán)境:windows7系統(tǒng)、jquery1.10.2版本、Dell G3電腦。
在jquery中,bind的意思為“綁定”,用于給指定元素綁定事件,并設(shè)置一個(gè)或多個(gè)事件處理函數(shù)。
bind() 方法向被選元素添加一個(gè)或多個(gè)事件處理程序,以及當(dāng)事件發(fā)生時(shí)運(yùn)行的函數(shù)。
將事件和函數(shù)綁定到元素的語法:
$(selector).bind(event,data,function)
參數(shù) | 描述 |
---|---|
event |
必需。規(guī)定添加到元素的一個(gè)或多個(gè)事件。 由空格分隔多個(gè)事件。必須是有效的事件。 |
data | 可選。規(guī)定傳遞到函數(shù)的額外數(shù)據(jù)。 |
function | 必需。規(guī)定當(dāng)事件發(fā)生時(shí)運(yùn)行的函數(shù)。 |
示例1:綁定點(diǎn)擊事件,并設(shè)置處理函數(shù)
實(shí)現(xiàn)的效果:當(dāng)點(diǎn)擊鼠標(biāo)時(shí),隱藏或顯示 p 元素
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <script src="js/jquery-1.10.2.min.js"></script> <script> $(document).ready(function() { $("button").bind("click", function() { $("p").slideToggle(); }); }); </script> </head> <body> <button>隱藏或顯示 p 元素。</button> <p>這是一個(gè)p段落</p> <p>這是一個(gè)p段落</p> </body> </html>
示例2:綁定多個(gè)事件
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <script src="js/jquery-1.10.2.min.js"></script> <script> $(document).ready(function(){ $("p").bind("mouseover mouseout",function(){ $("p").toggleClass("intro"); }); }); </script> <style type="text/css"> .intro { font-size: 150%; color: red; } </style> </head> <body> <p>將鼠標(biāo)移動(dòng)到該段落上。</p> </body> </html>
【推薦學(xué)習(xí):jQuery視頻教程、web前端視頻】