zoukankan      html  css  js  c++  java
  • 命名空间jquery

    命名空间的意思就是 同一个元素有绑定了2个相同的事件,比如2个scroll,这个时候你做其他交互的时候只想触发第二个scroll事件  就可以用命名空间做了

    <button id="but">命名空间</button>
    <p></p>

    说明命名空间之前,先来看一下原生js及jq的函数覆盖问题:

      原生js使用onclick时同一个元素有绑定了2个相同的事件,后面的事件会覆盖前面的事件

           var but = document.getElementById("but");
            but.onclick = function(){
                alert('原生js:相同元素定义的第一个事件');
            }
            but.onclick = function(){
                alert('原生js:相同元素定义的相同的第二个事件,但是会覆盖前面的第一个事件');
            }

    jquery中click(function(){})  、 on、bind  绑定的事件不会被覆盖 默认绑定几个  就触发几个

      click事件:

           $("button").click(function(){
                alert("jquery click aaaaa");
            });
            $("button").click(function(){
                alert("jquery click bbbbb");
            });

      on事件:

           $("button").on("click",function(){
                alert("jquery on click aaaaa");
            });
            $("button").on("click",function(){
                alert("jquery on click bbbbb");
            });

      bind事件:

           $("button").bind("click",function(){
                alert("jquery bind click aaaaa");
            });
            $("button").bind("click",function(){
                alert("jquery bind click bbbbb");
            });

    jq中click、on、bind事件中定义几个就会触发几个,如果只想触发其中一下怎么办呢?

    那就用到了命名空间:

    http://hemin.cn/jq/event.namespace.html

           $("p").bind('test.something',function(event){
                alert(event.namespace);
            });
            $("p").bind('test.hello',function(event){
                alert(event.namespace);
            });
            $("button").click(function(event) {
                $("p").trigger("test.something");
            });

    点击button时只触发空间something处的事件

  • 相关阅读:
    Redis学习第二天
    Redis学习
    jQuery基础
    Hashtable 和 HashMap 的区别
    JSP页面乱码问题
    Day28 java8:Stream API
    转 链表中节点每k个一组反转
    day 27 lambda表达式(针对接口) & 函数式接口
    day20异常2
    day20 异常1
  • 原文地址:https://www.cnblogs.com/loveamyforever/p/6118849.html
Copyright © 2011-2022 走看看