jquery利用命名空间移除绑定事件的方法
作者:bea
本文实例讲述了jquery利用命名空间移除绑定事件的方法。分享给大家供大家参考。具体分析如下: 最近研究jquery,发现了一个简单移除绑定事件的方法,命名空间。 例子很简单。 这里我绑定了三个事件,分别是click,mouseover和dblclick事件 其中click和mouseover事件我加入了命名空间,而dblclick没有加入命名空间。 利用一个button移除了绑定的事件。 这样避免了重复的使用bind和unbind方法,让你的代码看起来更简洁明了。
本文实例讲述了jquery利用命名空间移除绑定事件的方法。分享给大家供大家参考。具体分析如下:
最近研究jquery,发现了一个简单移除绑定事件的方法,命名空间。
例子很简单。
这里我绑定了三个事件,分别是click,mouseover和dblclick事件 其中click和mouseover事件我加入了命名空间,而dblclick没有加入命名空间。 利用一个button移除了绑定的事件。 这样避免了重复的使用bind和unbind方法,让你的代码看起来更简洁明了。
代码如下:
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(function (){
$("div").bind("click.plugin",function(){
$("body").append("<p>click事件</p>");
});
$("div").bind("mouseover.plugin",function(){
$("body").append("<p>mouseover事件</p>");
});
$("div").bind("dblclick",function(){
$("body").append("<p>dblclick事件</p>");
});
$("#but").click(function(){
alert("remove");
$("div").unbind(".plugin");
});
})
</script>
<div style="border: 1px solid red;height: 100px;width:300px;">已经绑定了<br/>click,mouseover,dblclick事件的层</div> <input id="but" type="button" value="remove"></input>
运行效果如下:
希望本文所述对大家的jQuery程序设计有所帮助。
有用 | 无用
最近研究jquery,发现了一个简单移除绑定事件的方法,命名空间。
例子很简单。
这里我绑定了三个事件,分别是click,mouseover和dblclick事件 其中click和mouseover事件我加入了命名空间,而dblclick没有加入命名空间。 利用一个button移除了绑定的事件。 这样避免了重复的使用bind和unbind方法,让你的代码看起来更简洁明了。
代码如下:
<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
<script type="text/javascript">
$(function (){
$("div").bind("click.plugin",function(){
$("body").append("<p>click事件</p>");
});
$("div").bind("mouseover.plugin",function(){
$("body").append("<p>mouseover事件</p>");
});
$("div").bind("dblclick",function(){
$("body").append("<p>dblclick事件</p>");
});
$("#but").click(function(){
alert("remove");
$("div").unbind(".plugin");
});
})
</script>
<div style="border: 1px solid red;height: 100px;width:300px;">已经绑定了<br/>click,mouseover,dblclick事件的层</div> <input id="but" type="button" value="remove"></input>
运行效果如下:
希望本文所述对大家的jQuery程序设计有所帮助。
有用 | 无用
猜你喜欢
您可能感兴趣的文章:
- JavaScript中return false的用法
- JavaScript中神奇的call()方法
- jquery实现无限分级横向导航菜单的方法
- JavaScript中定义函数的三种方法
- javascript实时显示北京时间的方法
- jquery实现焦点图片随机切换效果的方法
- JavaScript数据结构与算法之栈详解
- jQuery实现简单的日期输入格式化控件
- Javascript数据结构与算法之列表详解
- javascript实现 百度翻译 可折叠的分享按钮列表
- 基于jquery实现的自动补全功能
- jquery实现页面百叶窗走马灯式翻滚显示效果的方法
- window.open()实现post传递参数
- js运动动画的八个知识点
- js实现最短的XML格式化工具实例
- 微信中一些常用的js方法汇总
- javascript实现checkBox的全选,反选与赋值
- jQuery通过扩展实现抖动效果的方法
- jQuery实现字符串按指定长度加入特定内容的方法