将函数指针传递给JavaScript中的事件

时间:2012-08-11 07:24:57

标签: javascript events javascript-events event-handling

我理解在将函数指针传递给事件处理程序时,您无法使用括号调用功能块,或者该函数的返回值将分配给事件处理程序。我试过这个,我对它是如何工作感到困惑?

window.onload = alert("Hello, World.");

我可以看到这是如何运作的......

window.onload = function () { alert("Hello, World!"); };

文本函数不是自调用的,导致没有返回值,只有在调用onclick-event时才会调用。

编辑1:我不想用此来实现任何目标。我只是想了解window.onload = alert(“你好,世界。”);完美的工作以及window.onload = show_message(“你好,世界。”);不起作用?...考虑到show_message实际上是一个函数。

编辑2:某些用户声称onload事件处理程序可以在任何函数上使用括号。我不认为它的工作原理应该是这样,因为函数是在忽略事件处理程序的情况下调用的,并且该函数的返回值被赋给事件处理程序。大多数函数都不返回任何内容,因此(undefined或null)将被赋值给事件处理程序。

请看下面的代码。

var button = document.getElementById("button");

function test() {
    str = "works";
    console.log(str);
}

button.onclick = test;​

假设有一个按钮元素,其id分配给它。这只有在没有用括号调用test时才会起作用(button.onclick = test();)。测试只运行一次,未定义将分配给onclick。

编辑3:如果调用该函数,看起来似乎没有为事件处理程序分配返回值。当我使用console.log时,它总是向控制台写出null。

2 个答案:

答案 0 :(得分:2)

好问题。实际上它并不像你期望的那样工作。这种方式起作用只是幻觉。当你跑:

window.onload = alert("Hello, World.");

执行语句的右侧部分并显示警告,但是加载处理程序上的窗口未设置为某个函数,null将被分配给它,因为这是警报返回的内容。

顺便说一下,即使用括号调用方法,也可以从中返回函数以分配给事件处理程序:

var button = document.getElementById("button");

function test() {
    str = "works";
    console.log(str);
    return function(){console.log('button clicked');}
}

button.onclick = test();

答案 1 :(得分:2)

window.onload = alert("Hello, World.");,您看到警报只是因为它在执行时发出警报,并将结果(未定义)分配给window.onload