首页 > jquery 两个事件公用一个函数?

jquery 两个事件公用一个函数?

点击两个按钮,console 输出的数字是1,2,3,4,5,6...
为什么感觉像两个点击事件共用了一个函数?

<button class="b1">点我</button>
<button class="b2">点我</button>
var hehe = {
        a : 0,
        getX : function() {
           this.a++;
           console.log(this.a);
        }
    }
    $(".b1").on("click",function(){
         hehe.getX();
    });
    $(".b2").on("click",function(){
         hehe.getX.call(hehe);

你2个事件处理函数里,最终不都是调用的hehe.getX方法吗?


确切的说是,2个回调函数调用了同一个函数,但是输出结果按调用的顺序的不同而不同
如果修改成如下,结果就不同了,虽然调用的还是同一个函数对象;
点击b2的结果始终是11
点击b1次数越多值就越大

<button class="b1">点我</button>
<button class="b2">点我</button>
var hehe = {
        a : 0,
        getX : function() {
           this.a++;
           console.log(this.a);
        }
    }
    $(".b1").on("click",function(){
         hehe.getX();
    });
    $(".b2").on("click",function(){
         hehe.getX.call({
          a:10
         });
    }

b1按钮事件触发时,getX()方法的作用域是hehe
b2按钮事件触发时,getX()方法通过call获得的作用域依然是hehe
调用的方法,肯定是一个方法。即便你传给call的是另一个作用域,但是调用的getX()方法仍然是同一个方法。
你感觉到是用一个函数,其实是运行getX()方法的作用域是同一个作用域,两个按钮在同一个作用域下操作同一个变量。你call里传一个其他的对象,你再试试,肯定就不一样了。


确实是用的一个函数啊

【热门文章】
【热门文章】