$(selector).bind(event,data,function)
公司主營業(yè)務(wù):成都做網(wǎng)站、網(wǎng)站設(shè)計、移動網(wǎng)站開發(fā)等業(yè)務(wù)。幫助企業(yè)客戶真正實現(xiàn)互聯(lián)網(wǎng)宣傳,提高企業(yè)的競爭能力。成都創(chuàng)新互聯(lián)公司是一支青春激揚、勤奮敬業(yè)、活力青春激揚、勤奮敬業(yè)、活力澎湃、和諧高效的團(tuán)隊。公司秉承以“開放、自由、嚴(yán)謹(jǐn)、自律”為核心的企業(yè)文化,感謝他們對我們的高要求,感謝他們從不同領(lǐng)域給我們帶來的挑戰(zhàn),讓我們激情的團(tuán)隊有機(jī)會用頭腦與智慧不斷的給客戶帶來驚喜。成都創(chuàng)新互聯(lián)公司推出瑪納斯免費做網(wǎng)站回饋大家。
$(selector).live(event,data,function)//jquery1.9版本以下支持,jquery1.9及其以上版本刪除了此方法,jquery1.9以上版本用on()方法來代替$(selector).delegate(childSelector,event,data,function)//jquery1.4.2及其以上版本;$(selector).on(event,childselector,data,function)//jquery1.7及其以上版本;jquery1.7版本出現(xiàn)之后用于替代bind(),live()綁定事件方式;
event:必需項;添加到元素的一個或多個事件,例如 click,dblclick等;
單事件處理:例如 $(selector).bind("click",data,function);
多事件處理:1.利用空格分隔多事件,例如 $(selector).bind("click dbclick mouseout",data,function);
2.利用大括號靈活定義多事件,例如 $(selector).bind({event1:function, event2:function, ...})
3.空格相隔方式:綁定較為死板,不能給事件單獨綁定函數(shù),適合處理多個事件調(diào)用同一函數(shù)情況;
大括號替代方式:綁定較為靈活,可以給事件單獨綁定函數(shù);
data:可選;需要傳遞的參數(shù);
function:必需;當(dāng)綁定事件發(fā)生時,需要執(zhí)行的函數(shù);適用所有版本,但是根據(jù)官網(wǎng)解釋,自從jquery1.7版本以后bind()函數(shù)推薦用on()來代替。
.bind()與.on()的區(qū)別:
(1)是否支持selector這個參數(shù)值。由于javascript的事件冒泡特性,如果在父元素上注冊了一個事件處理函數(shù),當(dāng)子元素上發(fā)生這個事件的時候,父元素上的事件處理函數(shù)也會被觸發(fā)。
如果使用on的時候,不設(shè)置selector,那么on與bind就沒有區(qū)別了。
(2)on綁定的事件處理函數(shù),對于未來新增的元素一樣可以的,和delegate效果相同,而bind則不行。?
(3) delegate用法與on()相同,只是參數(shù)的順序不同:
擴(kuò)展資料:
.bind()與.on()的實際應(yīng)用:
1.bind()是直接綁定在元素上 ,將一本地地址與一套接口捆綁。如無錯誤發(fā)生,則bind()返回0。否則的話,將返回-1,應(yīng)用程序可通過WSAGetLastError()獲取相應(yīng)錯誤代碼。
用于事件處理程序
function ClassName(){
this.eventHandler = (function(){
}).bind(this);
}
2.on()則實現(xiàn)事件代理, 可以在匹配元素上綁定一個或者多個事件處理函數(shù)。
(1) 用來綁定多事件,并且為同一函數(shù),如:
$('div').on('click mouseover',function(){
//do sth
});
(2)多個事件綁定不同函數(shù),如:
$('div').on({
'click':function(){
//do sth
},
'mouseover':function(){
//do sth
}
});
(3)事件代理,如:
html:
button id="bt1"按鈕1/button
jq:
$('#bt1').on('click',function(){
$('body').append('button按鈕2/button');
});
$('body').on('click','.bt2',function(){
console.log('這是bt2');
}
參考資料:百度百科-bind()
bind() 方法為被選元素添加一個或多個事件處理程序,并規(guī)定事件發(fā)生時運行的函數(shù)。其語法為:
$(selector).bind(event,data,function)
參數(shù)說明如下:
event:規(guī)定添加到元素的一個或多個事件。必需。
data: ?規(guī)定傳遞到函數(shù)的額外數(shù)據(jù)。可選。
function: 規(guī)定當(dāng)事件發(fā)生時運行的函數(shù)。必需。
示例如下:
//?當(dāng)點擊鼠標(biāo)時,隱藏或顯示?p?元素:
$("button").bind("click",function(){
$("p").slideToggle();
});
沒啥區(qū)別,個人感覺是喜好寫法問題,我剛測試了一下,沒感覺有啥區(qū)別
D1:
$("#btn").bind("click",function(){
alert("test1");
});
$("#btn").bind("click",function(){
alert("test2");
});
D2:
$("#btn").click(function(){
alert("test1");
});
$("#btn").click(function(){
alert("test2");
});
這兩個執(zhí)行效果一樣,都會依次彈出來兩個對話框
我剛才又研究了一個jquery的源碼,諸如click(),dblclick(),mousemove()這樣的簡單寫法的事件綁定的都是調(diào)用的this.on(
name,
null,
data,
fn
)
這個方法進(jìn)行事件綁定的,而bind()也同樣是調(diào)用的這個
bind:
function(
types,
data,
fn
)
{
return
this.on(
types,
null,
data,
fn
);
},
所以說
click()只是簡化寫法,而且jquery的文檔里也有關(guān)于這樣的說明
----------------------------
以下的引用jquery文檔的說明
-----------------------------------------
.bind()
方法是用于往文檔上附加行為的主要方式。所有JavaScript事件對象,比如focus,
mouseover,
和
resize,都是可以作為type參數(shù)傳遞進(jìn)來的。
jQuery還提供了一些綁定這些標(biāo)準(zhǔn)事件類型的簡單方式,比如.click()用于簡化.bind('click')。一共有以下這些:blur,
focus,
focusin,
focusout,
load,
resize,
scroll,
unload,
click,
dblclick,
mousedown,
mouseup,
mousemove,
mouseover,
mouseout,
mouseenter,
mouseleave,
change,
select,
submit,
keydown,
keypress,
keyup,
error
。
問題1:
!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ""
html xmlns=""
head
meta http-equiv="Content-Type" content="text/html; charset=utf-8" /
titleSimple JQuery/title
script type="text/javascript" src="js/jquery.js"/script
script type="text/javascript"
$(function(){
$('#mybtn').bind('click', {a : 'hello', b : 'world'}, myFun);
});
function myFun(e) {
alert(e.data.a);
alert(e.data.b)
}
/script
/head
body
input type="button" id="mybtn" value="Click me." /
/body
/html
如上面例子,可以傳遞多個參數(shù)。
-------------------------------------------------------
問題2:
$('pTest/p').appendTo('.inner');
$('.inner').append('pTest/p');
上面這個是append()和appendTo()區(qū)別,應(yīng)該一目了然了吧?
而appendChild()不是jquery的方法,而是javascript原生的方法。
append和appendChild的關(guān)系是:
其實幾乎一樣,append就是調(diào)用appendChild實現(xiàn)的,只是在append前,做一個簡單判斷。下面貼下jquery的源代碼:
append: function() {
return this.domManip(arguments, true, function( elem ) {
if ( this.nodeType === 1 ) {
this.appendChild( elem );
}
});
}
--------------------------------------------------
問題3:
!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ""
html xmlns=""
head
meta http-equiv="Content-Type" content="text/html; charset=utf-8" /
titleSimple JQuery/title
script type="text/javascript" src="js/jquery.js"/script
script type="text/javascript"
$(function(){
$('#mybtn').bind('click', myFun);
});
function myFun() {
alert($(this).attr('value'));
}
/script
/head
body
input type="button" id="mybtn" value="Click me." /
/body
/html
第3個問題不是看的很明白?直接調(diào)用應(yīng)該可以呀,看看這個例子是不是你想要的?
---------------------------------------------------
問題4:網(wǎng)上有很多,查看參考鏈接這個吧。