AddEvenLister在連接後立即觸發

我想知道如何正確添加像onClick這樣的Event Listener到動態div。這裏是我的片斷：AddEvenLister在連接後立即觸發

var $menu = new Array(2); 
createDiv('yes');  

function createDiv(title) { 

var $class = 'menuLink'; 
var $title = 'title'; 

for(var i=0; i<$menu.length;i++) 
{ 
    $title = 'title'; 
    var newdiv = document.createElement('div'); 
    newdiv.setAttribute('class', $class); 
    newdiv.setAttribute('id', 'item'+i); 

    newdiv.addEventListener('onclick', clickHandle(newdiv.id),false); 

    if (title) 
    { 
    newdiv.innerHTML = $title; 
    } else { 
newdiv.innerHTML = "No Title"; 
    } 

    document.getElementById('menu').appendChild(newdiv); 
    showMenu(); 
} 
} 

function clickHandle(e) 
{ 
if(e == 'item0') 
{ 
    alert('Link is' + ' ' + e); 
}else{ 
    alert('Another Link'); 
} 
}

這裏是我的問題，該段工作正常，它創建了我的div，增加了ID的價值觀和所有，但該事件一旦事件附加觸發關閉，因此，儘管for循環創建div的警報窗口說：鏈接是item0，緊接着它說：另一個鏈接。

我誤解了嗎？（我在AS3中使用了這種方法的無數次與預期的結果，只是附加一個函數等待點擊）。我想要的是我的Div等待用戶點擊它們，而不是在連接後立即開始。感謝您對此提供的任何提示。問候。

Ps。 IE不支持addEventListener，但是我想在解決這個問題之前先到瘋狂的IE海洋，但是我也會很欣賞IE的方法。 - 我嘗試了「onclick」，只是點擊了addEventListener行，兩者的結果都是相同的。

來源

2012-11-24 Diego

更換

newdiv.addEventListener('onclick', clickHandle(newdiv.id),false);

與

(function(newdiv){ 
    newdiv.addEventListener('onclick', clickHandle(newdiv.id), false); 
})(newdiv);

沒有觸發的事件，但你打電話clickHandle(newdiv.id)並通過此調用的結果addEventListener。還要注意事件的名稱是'click'，而不是'onclick'。此外，變量newdiv由以下循環更改。這就是爲什麼我建議將它封入封閉體以防止其變化。

你也可以使用這樣的：

(function(newdiv){ 
    newdiv.onclick = function(){clickHandle(newdiv.id)}; 
})(newdiv);

來源

2012-11-24 10:58:56

嗨@dystroy，到目前爲止沒有結果。您的第一種和第二種方法將onclick應用於菜單項（div），但是當我點擊其中一個div時，它們都會提示'Item6'（這是我需要動態創建的divs /按鈕的數量）。最後一個是jQuery，我想了解如何使用js首先構建它。我使用了一種數組方法，但其結果與您的兩個建議都是一樣的：在單擊一個Div後，其ID是item6。這是增加：newdiv.setAttribute（'id'，'item'+ i）; $ menu.push（newdiv）; $ menu [i] .onclick = function（）{clickHandle（newdiv.id）};謝啦。 – Diego

@Diego請參閱編輯。我的解決方案在迭代時將newdiv的值包含在閉包中，以便它不會改變。 –

你是da man @dystroy。它像一個魅力。人只是一個小問題，我無法得到這個實現（我從AS3學到了一些函數，其中函數內的函數幾乎被禁止，因爲使用它們的範圍之外的問題）。所以，現在js又回來了，那麼encloures的概念是非常有用的。這個功能在括號內是什麼？它有什麼作用？爲什麼這條線有最後一個（newdiv）？男人感謝一些旁白的筆記，以真正瞭解這條偉大的線條是如何工作的。男人無論如何感謝很多！問候。 – Diego

既然你已經使用jquery爲什麼不能用它在你的事件綁定？

它的跨瀏覽器兼容，所以你不必擔心IE了

嘗試。點擊（）;

http://api.jquery.com/click/

來源

2012-11-24 11:02:10

你爲什麼認爲他在使用jQuery？ – Esailija

Nop man，我沒有使用jQuery。我只想用$符號聲明變量，這只是我喜歡的一種方式。謝謝你，我正在從As3移動到Js，所以我想盡可能地將它們粘到js上，以便在使用庫之前習慣它。 – Diego

哦，對不起，我剛剛給了它一個快速的答案今天早上，你的$標誌讓我想到:-) –

AddEvenLister在連接後立即觸發

回答

相關問題