引用一個沒有ID的div

我遇到了addEvent（或其他我不知道的問題）的問題。這是我的代碼。
HTML：引用一個沒有ID的div

<div style="background-color:red;height:30px;width:30px;" ></div> 
<div style="background-color:yellow;height:30px;width:30px;" ></div>

JS：

function addEvent(elm,ev,fun)//Cross-browser addEvent 
{ 
    if(elm.addEventListener)elm.addEventListener(ev,fun,false); 
    else if(elm.attachEvent) 
    { 
     var r=elm.attachEvent("on"+ev,fun); 
     return r; 
    } 
} 

function myFun(x) 
{ 
    alert(x.style.backgroundColor); 
} 

var allDiv=document.getElementsByTagName("div"); 
myFun(allDiv[0]);//Here it works 
for(var i=0;i<allDiv.length;i++) { 
     //But not here when you click the div 
     addEvent(allDiv[i], 
       "click",function(){ 
          myFun(allDiv[i]) 
         }); 
}

我想該警示工作，但沒有使用ID和沒有的onclick puting內聯。可能嗎？

http://jsfiddle.net/G9gBS/1/

來源

2012-05-07 user1365010

你已經掉進一個陷阱共同在JavaScript中使用閉包時。我關閉了，但是，所有的點擊功能的變化都呼籲myFunc的與allDiv[allDiv.length -1]您可以使用自執行的函數來解決這個問題

for(var i=0;i<allDiv.length;i++) { 
      addEvent(allDiv[i], 
        "click",(function(j) { 
           return function(){ 
             myFun(allDiv[j]) 
            } 
          }(i))); 
}

此不再關閉過我（我被分配到的功能不會被引用點擊事件）。

在這個特殊的情況下，但你可以簡單地通過這個。事件處理程序被調用的元素觸發事件的情況下，所以你可以使用jQuery

var myFun function(x) 
{ 
    alert(x.style.backgroundColor); 
} 

$("div").click(myFun);

來源

2012-05-07 12:51:23

如果我想訪問我onclick，我作爲參數傳遞什麼？ – user1365010

@ user1365010在第一個示例中，我提供了使用j的地方，否則您將使用i –

與其說這是allDiv[i]的，傳遞this回調函數。在調用onclick回調時，i超出範圍，無法通過allDiv[i]解決。該回調在呼叫<div>的背景下調用，參考文獻this。

for(var i=0; i<allDiv.length; i++) { 
     addEvent(allDiv[i], "click", function() { 
     // allDiv[i] is out of scope in the callback. Use this instead. 
     myFun(this); 
     }); 
}

Updated jsFiddle.

來源

2012-05-07 12:44:07

做

for(var i=0;i<allDiv.length;i++) { addEvent(allDiv[i], "click",function(){myFun(this)}); }

短

甚至@ user1365010好了，找到了真正的問題。 –

謝謝！但我仍然不明白爲什麼。這和allDiv [i]應該是一樣的！ – user1365010

@ user1365010請參閱我上面添加的註釋。在調用回調時'i'索引超出了範圍，並且在調用div「this'的上下文中調用了回調函數。 –

變化

for(var i=0;i<allDiv.length;i++)addEvent(allDiv[i],"click",function(){myFun(allDiv[i])});

到

for(var i=0;i<allDiv.length;i++)addEvent(allDiv[i],"click",function(){myFun(this)});

如果我想獲得我的onclick，我該怎麼傳遞的參數？

那樣，是一個辦法（另一種是使用綁定）：

for(var i=0;i<allDiv.length;i++){ 
    var bob = i; 
    addEvent(allDiv[i],"click",function(){ 
           alert(bob); 
           myFun(this,bob); 
    }); 
}

來源

2012-05-07 12:49:57

如果我想訪問我onclick，我作爲參數傳遞什麼？ – user1365010

引用一個沒有ID的div

回答

相關問題