Question

我已创建此代码段http://jsfiddle.net/PexkV/

<script>
var arc={};

arc.handler={
  background_color:'#8DBC8F',
  console_this: function(str){
    alert('lets write this to the console ' + str + ' ' + this.background_color);
  }

}

$(document).ready(function(){
  $('.more-click-me').on('click', arc.handler.console_this('here'));
  $('.more-click-me').on('click', function(){
    arc.handler.console_this('blue');
  });

});
</script>
<div class='more-click-me'>lets write this</div>

并且不确定为什么自动调用第一个事件（示例中的“here”）。它似乎只应该响应点击而被调用？我得不到什么？如果我做了一些非常愚蠢的语法问题，请提前抱歉。

事先提前

Answer 1

因为您正在调用该函数并将其返回值传递给.on()。实现您想要实现的目标的最简单方法是将匿名函数传递给.on()，就像您在第二个示例中所做的那样，并在其中调用您的console_this函数：

$('.more-click-me').on('click', function () {
    arc.handler.console_this('here');
});

这是一个updated fiddle。

Answer 2

因为你正在调用函数

arc.handler.console_this('here')

那不是分配功能。它应该看起来像第二个。

$('.more-click-me').on('click', arc.handler.console_this('here'));  <-- wrong
$('.more-click-me').on('click', function(){  <-- right, uses a closure
    arc.handler.console_this('blue');
});

所以它应该是

$('.more-click-me').on('click', function(){ arc.handler.console_this('here'); });  
$('.more-click-me').on('click', function(){ arc.handler.console_this('blue'); });

Answer 3

$('.more-click-me').on('click', arc.handler.console_this('here'));
$('.more-click-me').on('click', function(){
    arc.handler.console_this('blue');   });

在第一行中，您正在调用方法＆amp;试图将结果绑定到事件。

第二行足以设置事件绑定。

不确定为什么在这里触发这个jQuery click事件

3 个答案: