在此代码中:
function onHover_(){
$('p').css('background-color', 'red') ;
}
$( document ).ready(function() {
//1
$('p').click(onHover_);
//2
$('p').click(onHover_());
});
在第一行中,onHover_
函数在我点击<p>
标记后执行(正如我所料)。在第二行中,onHover_()
在文档准备好后立即被激活,这意味着它不会等待click
事件!
简单地说,为什么?
这是一个jsFiddle来测试代码。
在STO上找到this个帖子,但结果不是接受的答案会被预测。
答案 0 :(得分:7)
onHover_
是一个功能。
onHover_()
执行或调用函数
因此,当您为事件({1}}分配处理程序时,您希望在事件发生时调用函数。
但是当事件被绑定时 。
所以在这种情况下
( click, change)
$('p').click(onHover_());
的背景颜色会立即更改,而应该在您点击它时发生。这是因为p tags
跟随函数名称(它立即调用函数)。
如果您仍然对语法
感到困惑()
与
相同$('p').click(onHover_);
回调是一个匿名函数,在触发或执行特定事件时执行。
答案 1 :(得分:3)
第一个$('p').click(onHover_);
是正确的语法,使用函数引用作为回调。第二个是错误的调用函数而不等待处理程序点击被触发并使用返回的结果(如果有的话)作为回调。
答案 2 :(得分:2)
onHover_
传递对该函数的引用。这是您的正确调用。
onHover_()
调用函数(立即),并将其返回结果作为点击处理程序传递。
在绝大多数情况下,你需要前者。例外情况是onHover_
本身返回对回调函数的引用,例如
function makeHoverFunc() {
return function(e) {
...
}
}
$('p').on('click', makeHoverFunc());
后者的(偶然)优势在于您可以将参数传递给将在实际回调中使用的makeHoverFunc
调用。
答案 3 :(得分:2)
在JavaScript中,函数是一个可以传递的对象,就像数字4
和字符串'foo'
一样。
在标记为//1
的行中,您将名为onHover_
的函数传递给click
方法。 (当您单击<p>
)
在标记为//2
的行中,您正在执行名为onHover_
的函数(由方括号()
表示),并传递结果执行click
方法。
答案 4 :(得分:0)
基本上,差异在于触发功能。
//1
$('p').click(onHover_);
单击$('p')时运行onHover_函数。
//2
$('p').click(onHover_());
立即运行该函数,然后单击$('p')尝试执行函数返回的内容,在您的情况下,它再次是$('p'),它什么都不做。