如何在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并回退到direct属性方法。 搜索“addEvent”函数，有很多例子。

Answer 2

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

Answer 3

Javascript区分大小写，您需要将其写为小写。

除此之外，要设置事件侦听器，不应使用任何属性 。 这需要每次都要评估一个字符串 - 你可以从脚本中做得更好。 相反，为onclick属性分配一个函数：

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

高级事件注册会更好，但更复杂，因为Microsoft缺乏支持标准。

Answer 4

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

function deck0_onclick() {
    begin(i);
}

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

或直接：

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