javascript - Noob javascript，为什么会触发onload？

Question

所以我不明白为什么控制台会立即记录 1 onload 或者我one.onclick = alterIt(1)不应该等到我点击的时候one。无论如何，显然我不擅长 javascript，感谢您的帮助。

window.onload = initialize;
function initialize() {
    if (1 == 1){
        calculation();           
    }
}
function calculation() {
    var one = document.getElementById('one');
    one.onclick = alterIt(1);
}

function alterIt(x) {
    console.log(x);
}

Answer 1

当你写道：

one.onclick = alterIt(1); 

...然后您调用该alterIt函数并将返回值设置为onclick处理程序。相反，您想要：

one.onclick = function(){ alterIt(1) };

// ...or better yet
one.addEventListener('click',function(){ alterIt(1) },false);

Answer 2

当行one.onclick = alterIt(1);被执行时，alterIt(1)实际被评估。您想要的是将函数绑定到one.onclick，该函数仅在onclick事件触发时执行。你需要类似的东西

one.onclick = function() { alterIt(1) };

它不绑定alterIt(1)to的结果one.onclick，而是函数评估的结果。

Answer 3

您可以通过两种方式编写代码来解决此问题：

//Anonymous Closures
one.onclick = function(){ alterIt(1); };

//Bind Closures  
one.onclick = alertIt.bind(window, 1);

注意：所有浏览器都支持 Function.bind() 一年。如果你关心旧的浏览器，匿名闭包是最好的选择。

Answer 4

像这样包装函数调用，使其在单击之前不会触发：

window.onload = initialize;
function initialize() {
    if (1 == 1){
        calculation();           
    }
}
function calculation() {
    var one = document.getElementById('one');
    one.onclick = function(){ alterIt(1);};
}

function alterIt(x) {
   console.log(x);
}

小提琴示例：http: //jsfiddle.net/RkH6Q/

Answer 5

alterIt正在发生的事情是，当您应该将其传入时，您正在调用该函数。因此，像这样删除括号：

one.onclick = alterIt;