jquery下為Event handler傳遞動(dòng)態(tài)參數(shù)的代碼
更新時(shí)間:2011年01月06日 23:45:56 作者:
在jquery cook book里看到一篇給event handler傳遞動(dòng)態(tài)參數(shù)的文章 感覺(jué)挺實(shí)用的 跟大家分享下
實(shí)例代碼
<body>
<div id="demo"></div>
<button id="btn" >trigger it</button>
<script type="text/javascript">
(function($) {
//demo1
$("#demo").bind("demo-trigger", function(e, args) {
var info = [];
//對(duì)應(yīng)的我們從args參數(shù)中獲取數(shù)據(jù)
for(var prop in args) {
info.push(prop + ":" + args[prop]);
}
this.innerHTML = info.join(';');
});
$('#btn').click(function() {
// 我們把數(shù)據(jù)作為一個(gè)參數(shù)和我們關(guān)心的事件名一起傳入trigger方法
$('#demo').trigger('demo-trigger', {
name:'Andrew',
age: '23',
job: 'FrontEnd Dev'
});
});
/**demo2
$("#demo").bind("demo-trigger", function(e) {
var info = [];
//我們通過(guò)傳入的e.extra來(lái)獲取我們傳入的數(shù)據(jù)
for(var prop in e.extra) {
info.push(prop + ":" + e.extra[prop]);
}
//展現(xiàn)出來(lái)
this.innerHTML = info.join(';');
});
$('#btn').click(function() {
//這個(gè)用法很有意思 我們new一個(gè)jQuery Event對(duì)象 參數(shù)為我們關(guān)心的事件名
var event = new jQuery.Event("demo-trigger");
//給這個(gè)event附加一個(gè)屬性 包含我們的數(shù)據(jù)
event.extra = {
name:'Andrew',
age :'23',
job :'FrontEnd Dev'
};
//最后把event傳入trigger方法 ...看上面的$('#demo').....
$('#demo').trigger(event);
});**/
})(jQuery);
</script>
</body>
復(fù)制代碼 代碼如下:
<body>
<div id="demo"></div>
<button id="btn" >trigger it</button>
<script type="text/javascript">
(function($) {
//demo1
$("#demo").bind("demo-trigger", function(e, args) {
var info = [];
//對(duì)應(yīng)的我們從args參數(shù)中獲取數(shù)據(jù)
for(var prop in args) {
info.push(prop + ":" + args[prop]);
}
this.innerHTML = info.join(';');
});
$('#btn').click(function() {
// 我們把數(shù)據(jù)作為一個(gè)參數(shù)和我們關(guān)心的事件名一起傳入trigger方法
$('#demo').trigger('demo-trigger', {
name:'Andrew',
age: '23',
job: 'FrontEnd Dev'
});
});
/**demo2
$("#demo").bind("demo-trigger", function(e) {
var info = [];
//我們通過(guò)傳入的e.extra來(lái)獲取我們傳入的數(shù)據(jù)
for(var prop in e.extra) {
info.push(prop + ":" + e.extra[prop]);
}
//展現(xiàn)出來(lái)
this.innerHTML = info.join(';');
});
$('#btn').click(function() {
//這個(gè)用法很有意思 我們new一個(gè)jQuery Event對(duì)象 參數(shù)為我們關(guān)心的事件名
var event = new jQuery.Event("demo-trigger");
//給這個(gè)event附加一個(gè)屬性 包含我們的數(shù)據(jù)
event.extra = {
name:'Andrew',
age :'23',
job :'FrontEnd Dev'
};
//最后把event傳入trigger方法 ...看上面的$('#demo').....
$('#demo').trigger(event);
});**/
})(jQuery);
</script>
</body>
相關(guān)文章
jQuery Attributes(屬性)的使用(二、類篇)
本系列文章主要講述jQuery框架的屬性(Attributes)使用方法,我將以實(shí)例方式進(jìn)行講述,以簡(jiǎn)單,全面為基礎(chǔ),不會(huì)涉及很深,我的學(xué)習(xí)方法:先入門,后進(jìn)階!2009-12-12js之ActiveX控件使用說(shuō)明 new ActiveXObject()
ActiveX 控件廣泛用于Internet。它們可以通過(guò)提供視頻、動(dòng)畫內(nèi)容等來(lái)增加瀏覽的樂(lè)趣。不過(guò),這些程序可能出問(wèn)題或者向您提供不需要的內(nèi)容2014-03-03非常強(qiáng)大的 jQuery.AsyncBox 彈出對(duì)話框插件
今天無(wú)意中發(fā)現(xiàn)了這個(gè)插件,和大家分享一下,功能和樣式都很強(qiáng)大,調(diào)用也很方便,而且支持鎖定屏幕的效果,插件的效果圖如下,更多效果和皮膚請(qǐng)到官網(wǎng)下載!2011-08-08JQuery中Ajax()的data參數(shù)類型實(shí)例分析
這篇文章主要介紹了JQuery中Ajax()的data參數(shù)類型,結(jié)合實(shí)例形式較為詳細(xì)的分析了ajax方法中data的具體類型,需要的朋友可以參考下2015-12-12jQuery的animate函數(shù)實(shí)現(xiàn)圖文切換動(dòng)畫效果
animate()在jquery中作為一個(gè)方法,可用于創(chuàng)建動(dòng)畫效果,jquery中的animate()方法讓那個(gè)頁(yè)面增加了很好的視覺(jué)效果2015-05-05用Jquery重寫windows.alert方法實(shí)現(xiàn)思路
本文將介紹下用Jquery重寫windows.alert方法,已經(jīng)在 IE8 , firefox3.0.11下面測(cè)試通過(guò),喜歡的朋友可以放心使用2013-04-04jquery增加時(shí)編輯jqGrid(實(shí)例代碼)
jquery增加時(shí)編輯jqGrid(實(shí)例代碼)。需要的朋友可以過(guò)來(lái)參考下,希望對(duì)大家有所幫助2013-11-11