復制代碼 代碼如下:
$().ready(function(){
for(var i=0;i<5;i++){
/**
* 這種寫法不專業,如果處於循環裡,就會注冊5次事件,點擊後alert5次
*/
// $("#aa").click(function(){
// alert("hahahaha");
// });
/**
* 這種寫法才是專業的,在注冊一次點擊事件前,先解綁點擊事件,然後再綁定一個點擊事件,所以到最後只綁定了一次點擊事件
*/
$("#aa").unbind("click");
$("#aa").bind("click",function(){
alert("oooooo");
});
}
});
自定義事件:
復制代碼 代碼如下:
$().ready(function(){
/**
* 自定義事件,在click的時候進行觸發
*/
$("#aa").bind("click",function(){
//事件觸發器,觸發自定義的event
$(this).trigger("點我");
});
//自定義一個"點我"事件
$("#aa").unbind("點我");
$("#aa").bind("點我",function(){
alert("點我");
});
});
傳遞參數的自定義事件:
復制代碼 代碼如下:
$().ready(function(){
/**
* 自定義事件,在click的時候進行觸發
*/
$("#aa").bind("click",function(){
//事件觸發器,觸發自定義的event,傳遞實參
$(this).trigger("點我",['張三','李四']);
});
//自定義一個"點我"事件
$("#aa").unbind("點我");
//第一個參數是固定的,後面都是自定義,就算把event寫成別的名字,它還是固定類型,鼠標事件
$("#aa").bind("點我",function(event,a,b){
alert("點我");
alert(a);
alert(b);
});
});
練習:
寫一個自定義事件,把該事件綁定在一個下拉列表框中
當下拉列表框選中一項的時候,觸發該事件,以參數的形式把選中的值傳遞到自定義事件中,並輸出。
html:
復制代碼 代碼如下:
<select id="select">
<option value="111">111</option>
<option value="222">222</option>
<option value="333">333</option>
</select>
js:
復制代碼 代碼如下:
$().ready(function(){
$("option").unbind("click");
$("option").bind("click",function(){
$(this).trigger("選擇並顯示",[$(this).val()]);
});
$("option").unbind("選擇並顯示");
$("option").bind("選擇並顯示",function(event,value){
alert(value);
});
});