• 场景：页面上的某个元素bind多个click事件处理函数，视用户的具体交互情况来决定到底使用哪个处理函数。
  • 问题：
    1. unbind时会解绑所有的click事件，造成误伤。如果之前bind时有定义处理函数的方法名，可以通过将方法名传给unbind的第二个参数来解绑指定的bind；但很多情况下bind的处理函数都是匿名函数，此时unbind的第二个参数无法处理。
    2. click事件发生时无法指定调用某个具体的事件处理函数,只能将不该调用的函数给unbind掉。
  • 解决：采用命名空间，命名空间用法
  • <!DOCTYPE html>
    
<html xmlns="http://www.w3.org/1999/xhtml">
    
<head>
    
    <title></title>
    
    <script type="text/javascript" src="Script/jquery-1.7.1.min.js"></script>
    
    <script type="text/javascript">
    
        function myfunction1() {
    
            alert(1);
    
            return false;
    
        }
    
        function myfunction2() {
    
            alert(2);
    
            return false;
    
        }
    
        function myfunction3() {
    
            alert(3);
    
            return false;
    
        }
    
        $(function () {
    
            $('#test').bind('click.a', myfunction1);
    
            $('#test').bind('click.b', myfunction2);
    
            $('#test').bind('click.c', myfunction3);

            $('#test').unbind('click.a');
    
            //$('#test').trigger('click.b');
    
            $('#test').trigger();
    
           // $('#test').click();
    
        })
    
    </script>
    
</head>
    
<body>
    
    <input id="test" type="button" name="button" value="button" width="70">
    
</body>
    
</html>

    通过事件名(click)后加'.'来指定新的命名，本例中分别指定的新的命名a、b、c，这样在unbind时就可以解绑指定的函数;在trigger时就可以调用指定的函数。很多js扩展功能都采用命名空间来区分出自己的事件和避免与页面原有事件产生冲突。

  • 参考链接：http://blog.csdn.net/clangke/article/details/7612224

jquery中bind事件时的命名空间用法(转)的更多相关文章

  1. jQuery中绑定事件bind() on() live() one()的异同

    jQuery中绑定事件的四种方法,他们可以同时绑定一个或多个事件 bind()-------------------------版本号小于3.0(在Jquery3.0中已经移除,相应unbind()也 ...

  2. JQuery中bind和unbind函数与onclick绑定事件区分

    JQuery中bind和unbind函数转载:   https://blog.csdn.net/liucheng417/article/details/51131982 页面代码: <body& ...

  3. Jquery中的事件绑定$(&quot;#btn&quot;).bind(&quot;click&quot;,function(){ })

    Jquery中的事件绑定:$("#btn").bind("click",function(){  }) 由于每次都这么调用太麻烦,所以jquery就用$(&qu ...

  4. jQuery中的事件与动画 (你的明天Via Via)

    众所周知,页面在加载时,会触发load事件:当用户单击某个按钮时,会触发该按钮的click事件. 这些事件就像日常生活中,人们按下开关,灯就亮了(或者灭了),往游戏机里投入游戏币就可以启动游戏一样, ...

  5. Jquery中的事件和动画

    在学习Jquery中的过程中我们绝大部分都用到了事件的操作,也可以说事件是Jquery中必不可少的一部分,我们常见的一些事件有单击事件,鼠标事件,键盘事件等等.在Jquery中的学习中为了能使让页面以 ...

  6. 【jQuery基础学习】03 jQuery中的事件与动画

    关于jQuery中的事件 js与HTML之间的交互是通过用户和浏览器操作页面时引发的事件来处理的. jQuery增加并扩展了基本的事件处理机制,jQuery不仅提供了更加优雅的事件处理方法,而且极大地 ...

  7. 锋利的jQuery读书笔记---jQuery中的事件

    jQuery中的事件: 1.加载DOM:注意window.onload和$(document).ready()的不同 2.事件绑定 3.合成事件 --2和3的详细信息见代码- <!DOCTYPE ...

  8. 第4章 jQuery中的事件和动画

    4.1 jQuery中的事件 4.1.1 加载DOM jQuery就是用 `$(document).ready()方法来代替传统JavaScript的window.onload方法的. 1.执行时机 ...

  9. 第3章 jquery中的事件和动画

    一,jquery中的事件 (1).执行时机 $(document).ready()和window.onload方法有相似的功能,但是在执行时机方面有区别,windwo.onload在网页中所有的元素包 ...

随机推荐

  1. 189. Rotate Array -- 将数组前一半移到后一半

    Rotate an array of n elements to the right by k steps. For example, with n = 7 and k = 3, the array ...

  2. SqlServer中把结果集放到到临时表的方法

    一. SELECT INTO   1. 使用select into会自动生成临时表,不需要事先创建   select * into #temp from sysobjects   01. 把存储过程结 ...

  3. Tengine vs openresty

      简介 Tengine是由淘宝网发起的Web服务器项目.它在Nginx的基础上,针对大访问量网站的需求,添加了很多高级功能和特性.Tengine的性能和稳定性已经在大型的网站如淘宝网,天猫商城等得到 ...

  4. spring校验相关

    转载:http://elim.iteye.com/blog/1812584 对于任何一个应用而言在客户端做的数据有效性验证都不是安全有效的,这时候就要求我们在开发的时候在服务端也对数据的有效性进行验证 ...

  5. 从客户端中检测到有潜在危险的Request.Form值的解决方法

    描述:从客户端中检测到有潜在危险的Request.Form值的解决方法asp.net 2.0 通常解决办法将.aspx文件中的page项添加ValidateRequest="false&qu ...

  6. C#入门篇6-10：字符串操作 DateTime操作

    #region DateTime操作 public class C3 { //DateTime常用的操作 public static void Fun1() { //格式:2012-8-16 11:2 ...

  7. Java：标示符 基本数据类型

    标示符: 在程序中自定义的一些名称,例如:变量.类名.方法名…… 组成有数字0~9.大小写英文字母.“$”和下划线“_”组成,且不能由数字开头,以及不能使用java已使用和保留的关键字. Java中的 ...

  8. qml 相关的博客

    http://qt-project.org/wiki/SpaceAppsChallengeResources http://www.ics.com/blog https://www.ics.com/d ...

  9. velocity插件 veloeclipse 支持eclipse4.4

    分享主页:http://pan.baidu.com/share/home?uk=2737650112#category/type=0 http://pan.baidu.com/s/12RSAy 感谢究 ...

  10. ubuntu 14.04 上安装有道词典

    Ubuntu 14.04用户在安装前要更新系统,即update&dist-upgrade. 下载地址:32/64bits http://codown.youdao.com/cidian/lin ...