如何在javascript中为div添加onclick函数？

Question

我有一段javascript意味着将一个onclick事件添加到div。

div看起来像这样：

<div id="deck0" class="deck"></div>

我的javascript有：

var i = 1;
document.getElementById('deck0').SetAttribute("onclick", "begin("+i+")");   

但是我收到了这个错误：

Uncaught TypeError: Object #<HTMLDivElement> has no method 'SetAttribute' 

我做得对吗，或者我想要达到的目标是不可能的？

Answer 1

不要使用 setAttribute 来设置侦听器，并非所有浏览器都允许。要么直接设置房产要好得多：

document.getElementById('deck0').onclick = begin;

或使用 addEventListener ：

document.getElementById('deck0').addEventListener('click', begin, false);

如果您需要传递参数，那么：

document.getElementById('deck0').onclick = function() {begin(i);};

类似于 addEventListener 。

请注意，早期版本的IE不支持 addEventListener ，因此您需要跨浏览器功能来进行支持测试。缺少的地方，测试 attachEvent 并回退到直接属性方法。搜索“addEvent”函数，有很多例子。

Answer 2

Javascript区分大小写。
那应该是setAttribute。

Answer 3

Javascript区分大小写，您需要将it写成小写。

除此之外，要设置event listeners，不应使用attributes。这需要每次都要评估一个字符串 - 你可以从脚本中做得更好。而是将功能分配给onclick property：

document.getElementById('deck0').onclick = function(event) {
    begin(1);
};

Advanced event registration会更好，但更复杂，因为微软缺乏支持标准。

Answer 4

还有其他方法可以将函数与onclick事件相关联：

function deck0_onclick() {
    begin(i);
}

document.getElementById('deck0').onclick = deck0_onclick;

或直接：

document.getElementById('deck0').onclick = function() {begin(i);}