jquery利用命名空间移除绑定事件的方法

 更新时间:2015年03月11日 15:31:33   作者:jeffsui  
这篇文章主要介绍了jquery利用命名空间移除绑定事件的方法,实例分析了jQuery命名空间及事件绑定的技巧,具有一定参考借鉴价值,需要的朋友可以参考下

本文实例讲述了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实现鼠标单击网页文字后在文本框显示的方法

    jQuery实现鼠标单击网页文字后在文本框显示的方法

    这篇文章主要介绍了jQuery实现鼠标单击网页文字后在文本框显示的方法,可实现鼠标点击上方文字即可在下方勾选处文本框显示对应文字的效果,涉及jQuery鼠标事件及链式操作的相关技巧,需要的朋友可以参考下
    2015-05-05
  • Jquery阻止事件冒泡 event.stopPropagation

    Jquery阻止事件冒泡 event.stopPropagation

    帮朋友写了一个小效果,单击标签后标签变色并添加一个叉的图片,点击叉标签恢复原样,具体效果请点击下面的result
    2011-12-12
  • jQuery实现可以扩展的日历

    jQuery实现可以扩展的日历

    这篇文章主要为大家详细介绍了jQuery实现可以扩展的日历,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-12-12
  • php结合imgareaselect实现图片裁剪

    php结合imgareaselect实现图片裁剪

    这篇文章主要介绍了php结合imgareaselect实现图片裁剪的相关资料,需要的朋友可以参考下
    2015-07-07
  • jquery实现加载进度条提示效果

    jquery实现加载进度条提示效果

    这篇文章主要介绍了jquery实现加载进度条提示效果,感兴趣的小伙伴们可以参考一下
    2015-11-11
  • jquery ajax分页插件的简单实现

    jquery ajax分页插件的简单实现

    这篇文章主要介绍了jquery ajax分页插件的简单实现的相关资料,需要的朋友可以参考下
    2016-01-01
  • 使用jquery实现div的tab切换实例代码

    使用jquery实现div的tab切换实例代码

    以前使用js代码来写的简单效果现在用jQ来写,具体实现如下,感兴趣的朋友可以参考下哈
    2013-05-05
  • jQuery性能优化的38个建议

    jQuery性能优化的38个建议

    想必大家对于jQuery这个最流行的javascript类库都不陌生,而且只要是前端开发人员肯定或多或少的使用或者接触过,在这篇文章中,参考了一些资料及实际使用效率,将介绍一些书写高质量jQuery代码的原则,不单单会告诉你如何去书写,也会告诉你为什么这样书写,希望大家会觉得有所帮助
    2014-03-03
  • jquery.post用法关于type设置问题补充

    jquery.post用法关于type设置问题补充

    当使用ajax获取data数据的时候,直接data.foo就可以得到。而较低版本的jquery就不行比如1.4之前,下面为大家介绍下jquery.post用法关于type设置问题
    2014-01-01
  • jQuery+AJAX实现无刷新下拉加载更多

    jQuery+AJAX实现无刷新下拉加载更多

    这篇文章主要介绍了jQuery+AJAX实现无刷新下拉加载更多的相关资料,需要的朋友可以参考下
    2015-07-07

最新评论