jQuery中 bind的用法簡(jiǎn)單介紹
bind介紹
bind() 方法為被選元素添加一個(gè)或多個(gè)事件處理程序，并規(guī)定事件發(fā)生時(shí)運(yùn)行的函數(shù)。
語(yǔ)法
$(selector).bind(event,data,function)
event 必須。添加到元素的一個(gè)或多個(gè)事件如：click,mouseover,mouseup，change，select
data 可不填。傳遞到函數(shù)的額外數(shù)據(jù)，如：$(selector).bind(“click”,”input”,function(){});
function(){} 必填。綁定事件觸發(fā)的函數(shù)
bind綁定多個(gè)函數(shù)
$("button").bind({ // 注意它的格式是 json
click:function(){$("div").css("border","5px solid orange");},
mouseover:function(){$("div").css("background-color","red");},
mouseout:function(){$("div").css("background-color","#FFFFFF");}
});
4.bind綁定數(shù)據(jù)
// bind() 綁定 click 事件傳 參數(shù)2 并且打印出 參數(shù)2
$('button').bind('click',['路飛','索隆','烏索普'],function(event){
alert(event.data[0]); // 路飛
});
5.unbind bind事件移除
html 代碼
<button>unbind()</button> <p>點(diǎn)我刪除上邊按鈕的事件</p>
js 代碼
// bind() 綁定多個(gè)點(diǎn)擊事件
$('button').click(function(){
alert('我是第一個(gè)點(diǎn)擊事件');
});
$('button').click(function(){
alert('我是第二個(gè)點(diǎn)擊事件');
});
$('button').bind('click',function(){
alert('我是第三個(gè)點(diǎn)擊事件');
});
// unbind() 刪除點(diǎn)擊事件
$('p').bind('click',function(){
$('button').unbind('click');
alert('button 的點(diǎn)擊事件被刪除');
});
以上所述是小編給大家介紹的jQuery中的 bind用法簡(jiǎn)單介紹，希望對(duì)大家有所幫助，如果大家有任何疑問請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！
相關(guān)文章
jQuery彈性滑動(dòng)導(dǎo)航菜單實(shí)現(xiàn)思路及代碼
用一個(gè)絕對(duì)定位的div作為動(dòng)畫滑塊,改變它的left屬性來呈現(xiàn)動(dòng)畫效果javascript：hover()觸發(fā)移動(dòng)鼠標(biāo)到導(dǎo)航nav的動(dòng)作，和移出導(dǎo)航nav的動(dòng)作2013-05-05
下面小編就為大家?guī)硪黄钊肜斫?.each和$(selector).each。小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-05-05
jQuery插件FusionWidgets實(shí)現(xiàn)的Cylinder圖效果示例【附demo源碼】
這篇文章主要介紹了jQuery插件FusionWidgets實(shí)現(xiàn)的Cylinder圖效果,結(jié)合實(shí)例形式分析了jQuery使用FusionWidgets結(jié)合swf文件讀取xml數(shù)據(jù)并采用Cylinder圖展示的相關(guān)實(shí)現(xiàn)技巧,并附帶demo源碼供讀者下載參考,需要的朋友可以參考下2017-03-03
使用jQuery實(shí)現(xiàn)一個(gè)類似GridView的編輯,更新,取消和刪除的功能
在項(xiàng)目中遇到這樣的需求當(dāng)用戶點(diǎn)擊編輯時(shí)，在點(diǎn)擊行下動(dòng)態(tài)產(chǎn)生一行，編輯銨鈕變?yōu)閐isabled,新產(chǎn)生的一行有更新和取消的銨鈕，點(diǎn)擊“取消”銨鈕，刪除剛剛動(dòng)態(tài)產(chǎn)生的行，編輯銨鈕狀態(tài)恢復(fù)。下面小編給大家分享實(shí)例代碼，一起看看吧2017-03-03
基于jQuery實(shí)現(xiàn)點(diǎn)擊彈出層實(shí)例代碼
基于jquery實(shí)現(xiàn)點(diǎn)擊鏈接彈出層效果，其基本實(shí)現(xiàn)原理是這樣的：jquery操作DOM元素。對(duì)層樣式的設(shè)置。將display:設(shè)置為none;讓層隱藏；對(duì)jq點(diǎn)擊彈出層相關(guān)知識(shí)感興趣的朋友一起學(xué)習(xí)吧2016-01-01
本文通過實(shí)例代碼告訴大家如何利用jQuery獲取file控件中圖片的寬高與大小，在我們上傳之前就可以檢查上傳圖片的大小，高度，寬度是否適合我們的要求了，下面是關(guān)于判斷圖片的寬高大小的代碼。2016-08-08
這篇文章主要為大家詳細(xì)介紹了jQuery處理XML文件的幾種形式方法,如何使用jQuery解析XML，感興趣的小伙伴們可以參考一下2016-06-06
jQuery獲取Radio,CheckBox選擇的Value值(示例代碼)
這篇文章主要是對(duì)jQuery獲取Radio,CheckBox選擇的Value值進(jìn)行了詳細(xì)的介紹，需要的朋友可以過來參考下，希望對(duì)大家有所幫助2013-12-12
jquery checkbox全選、取消全選實(shí)現(xiàn)代碼
jquery實(shí)現(xiàn)checkbox全選、取消全選的代碼。2010-03-03
jQuery中.attr()和.data()的區(qū)別分析
$.attr()和$.data()本質(zhì)上屬于 DOM屬性 和 Jquery對(duì)象屬性 的區(qū)別。下面通過一個(gè)示例給大家介紹jQuery中.attr()和.data()的區(qū)別，一起看看吧2017-09-09