$().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);
});
});