javascript - 如何在 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 区分大小写，您需要将其写成小写。

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

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

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

Answer 4

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

function deck0_onclick() {
    begin(i);
}

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

或直接：

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