如何在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);}