jquery中bind事件时的命名空间用法(转)

  • 场景:页面上的某个元素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
时间: 2024-10-24 13:39:05

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

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

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

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

Jquery中的事件绑定:$("#btn").bind("click",function(){  }) 因为每次都这么调用太麻烦,所以jquery就用$("#btn").click(function(){})来进行简化 Jquery中的事件绑定$("#btn").bind("click",function(){ })

jQuery中的事件和动画

一.jQuery中的事件 加载DOM 在JS中等待页面加载完成通常使用window.onload方法,而在jQuery中则使用$(document).ready()方法来替代传统的window.onload方法.这两者有很大的不同: 执行时机 window.onload方法是在网页所有的元素(包括元素关联的文件)完全加载到浏览器后才能执行.而Query中的$(document).ready()方法,在DOM载入就绪就可以对其操纵并调用它绑定的函数,此时网页中的所有元素可能并没有下载完毕. 有时我

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

众所周知,页面在加载时,会触发load事件:当用户单击某个按钮时,会触发该按钮的click事件. 这些事件就像日常生活中,人们按下开关,灯就亮了(或者灭了),往游戏机里投入游戏币就可以启动游戏一样, 通过种种事件实现各项功能或执行某项操作.事件在元素对象与功能代码中起着重要的桥梁作用. 在jQuery中,事件总体分为两大类:简单事件和复合事件. jQuery中的简单事件,与JavaScript中的事件几乎一样,都含有window事件.鼠标事件.键盘事件.表单事件等, 只是其对应的方法名称有略微不

锋利的jQuery第四章:jQuery中的事件和动画

第一部分 1, (1)$()是$(document)的简写,默认参数是document. $(function(){}是$(document).ready(function(){})的简写. 2, (1)事件绑定 bind(type [,data],fn); type是事件类型,有blur,focus,load,resize,scroll,unload,click,dbclick,mousedown,mouseup, mouseover,mousemove,mouseout,mouseenter

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

jQuery中的事件: 1.加载DOM:注意window.onload和$(document).ready()的不同 2.事件绑定 3.合成事件 --2和3的详细信息见代码- <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <script type="text/javascript" src="../../

jQuery中绑定事件的几种方法

以click事件为例,jQuery中绑定事件有三种方法: (1)target.click(function(){}); (2)target.bind("click",function(){}); (3)target.live("click",function(){}); 第一种方法很好理解,其实就和普通JS的用法差不多,只是少了一个on而已 第二.三种方法都是绑定事件,但是二者又有很大的不同,下面着重讲解一下,因为这个如果用到Jquery的框架的话是用的挺多的,尤其

jQuery中 .bind() .live(). delegate() . on() 的区别

jQuery中   .bind()    .live().   delegate() .   on()  的区别 这几种方法都是绑定事件用到的,但是他们之间有些差别 bind(type,[data],fn) 为每个匹配元素的特定事件绑定事件处理函数 例如: <ul> <a href="#"><li>1111111</li></a> <a href="#"><li>22222</

[转载]Jquery中$.get(),$.post(),$.ajax(),$.getJSON()的用法总结

本文对Jquery中$.get(),$.post(),$.ajax(),$.getJSON()的用法进行了详细的总结,需要的朋友可以参考下,希望对大家有所帮助. 详细解读Jquery各Ajax函数: $.get(),$.post(),$.ajax(),$.getJSON() 一,$.get(url,[data],[callback]) 说明:url为请求地址,data为请求数据的列表,callback为请求成功后的回调函数,该函数接受两个参数,第一个为服务器返回的数据,第二个参数为服务器的状态,