的Javascript功能自动执行

如果我以这种方式编写事件，操作执行时，它应该：的Javascript功能自动执行

document.getElementById('myElem').onmousedown = (e) => { 
    console.log('fired!') 
    }

但是，如果我正在写在其他方式相同的东西，加载页面时操作执行，一旦：

let HandleEvent = (event) => { 
console.log('fired!') 
} 
document.getElementById('myElem').onmousedown = HandleEvent(event)

UPD： Ofcourse，这只是例子，HandleEvent功能将有更多复杂的逻辑。

我的问题是：

为什么？
如何使其正常工作？

来源

2016-07-07 Src

'onmousedown'需要一个'function'引用，但是你传递的是函数的返回值（它是'undefined'），因为你正在调用它。请改用'document.getElementById（'myElem'）。onmousedown = HandleEvent'。 – haim770

document.getElementById('myElem').onmousedown = HandleEvent;

会做你想要什么;分配时不应执行处理程序。您应该只分配函数引用。

那么你也可以将其指定为onload处理，甚至把它自己（如果你不依靠事件对象）

来源

2016-07-07 11:15:45

好的，谢谢！ – Src

document.getElementById('myElem').onmousedown = HandleEvent;

要通过附加参数，你可以使用绑定：

document.getElementById('myElem').onmousedown = HandleEvent.bind(null, argument1, argument2);

...或者你可以使用一个工厂函数：

document.getElementById('myElem').onmousedown = createHandler(); 

function createHandler() { 
    var a = calculateA(); 
    var b = calculateA(); 
    return function handleEvent() { 
    //use a and/or b 
    }; 
}

还有其他的办法了。精确的代码将取决于你的用例。

来源

2016-07-07 11:13:33 Ben

我怎样才能传递额外的参数功能？ – Src

@Src'Function.prototype.bind' – gcampbell

@Src：那不是你的问题。本回答你问的问题。（你可以很容易找到答案，通过搜索SO，它被非常非常彻底地回答。） –

删除事件

let HandleEvent = (event) => { 
console.log('fired!') 
} 
document.getElementById('myElem').onmousedown = HandleEvent

来源

2016-07-07 11:14:14

删除事件不是一个很好的描述删除括号做了什么。 –

你不需要event。

let HandleEvent = (event) => 'fired!'; 
document.getElementById('myElem').onmousedown = HandleEvent

来源

2016-07-07 11:15:57

如果你想传递一个属性

let HandleEvent = (event) => { 
console.log('fired!') 
} 
document.getElementById('myElem').onmousedown = HandleEvent.bind(attribute)

来源

2016-07-07 11:16:20 Marc

你所做的只是分配什么的handleEvent（）的事件的结果，而应该将功能分配给它。

正确的语句：

的document.getElementById（ 'myElem'）onmousedown事件=的handleEvent;

来源

2016-07-07 11:21:33 engineforce

的Javascript功能自动执行

回答

相关问题