首页 > web前端 > js教程 > JavaScript加强之自定义event事件_javascript技巧

JavaScript加强之自定义event事件_javascript技巧

WBOY
发布: 2016-05-16 17:21:55
原创
1083 人浏览过
复制代码 代码如下:

$().ready(function(){
for(var i=0;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:
复制代码 代码如下:



js:
复制代码 代码如下:

$().ready(function(){
$("option").unbind("click");
$("option").bind("click",function(){
$(this).trigger("选择并显示",[$(this).val()]);
});

$("option").unbind("选择并显示");
$("option").bind("选择并显示",function(event,value){
alert(value);
});

});
相关标签:
来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
最新问题
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板