未能改變節點內容+ JavaScript的

我寫了這個代碼創建菜單與div標籤未能改變節點內容+ JavaScript的

HTML：

<div id="firstMenuList"> 
      <div id="firstMenu">choose▼</div> 
       <div id="menulist" class="menulist"></div>  
</div>

的JavaScript：

<script> 
function ccc() { 

var id="firstMenu"; 

var ar=new Array("hi","there","hello","world"); 

var node=document.createElement("div"); 

var parent=document.getElementById("menulist"); 

var nodeData=""; 

for (var i=0;i<ar.length;i++) 
{ 
    var node=document.createElement("div"); 
    node.setAttribute("id",id+""+i); 
    node.setAttribute("class","menulist"); 

    node.setAttribute("onclick","select("+id+""+i+")"); 
    node.style.top=((i+1)*100)+3+"%"; 
    node.innerHTML=ar[i]; 
    parent.appendChild(node); 

} 
} 

function select(id) 
{ 
var p=document.getElementById(id);<-this doesn't work on elements that created dynamically 
p.style.backgroundColor="red"; 
var t = p.innerHTML; 
} 
</script>

此代碼創建的菜單，但是當我點擊菜單項代碼中斷時。的錯誤是「父爲空」 -

來源

2013-10-30 arvin karimi

您的代碼不工作_reason_是，你已經忘記了周圍的ID內的報價。這工作：'node.setAttribute（「onclick」，「select（'」+ id +「」+ i +「'）」）;'但使用其他解決方案發布在這裏。 – 2013-10-30 22:28:31

我會建議，以避免內聯事件綁定。這是一個工作示例：

http://jsfiddle.net/H4S2f/1/

function ccc() { 

var id="firstMenu"; 
var cls="firstMenuList"; 
var ar=new Array("hi","there","hello","world"); 
var node=document.createElement("div"); 
var parent=document.getElementById("menulist"); 
var nodeData=""; 

for (var i=0;i<ar.length;i++) 
{ 
    var node=document.createElement("div"); 
    node.setAttribute("id",id+""+i); 
    node.setAttribute("class","menulist"); 
    (function(i) { 
     node.addEventListener("click", function() { 
      select(id+""+i) 
     }); 
    })(i); 
    node.style.top=((i+1)*100)+3+"%"; 
    node.innerHTML=ar[i]; 
    parent.appendChild(node); 

} 
} 

function select(id) 
{ 
var p=document.getElementById(id); 
p.style.backgroundColor="red"; 
var t = p.innerHTML; 
} 

ccc();

來源

2013-10-30 22:27:18 Krasimir

謝謝，它的工作。 –

我不明白這個 - >（函數（i）{node.addEventListener（「click」，function（）{{}} {012}}};}};（ }}; –

我這樣做是因爲我需要保留* i *的值。即在事件監聽器中，* i *變量是從上面的範圍獲得的。一旦for循環結束，* i *對所有聽衆都是一樣的。這就是爲什麼我把所有東西都包裹在封閉物中 – Krasimir

要通過id來，你需要確保你把引號將ID功能：

node.setAttribute("onclick","select('"+id+i+"')"); 
// note the single quotes ----------^--------^

演示：http://jsfiddle.net/QK5Wh/1/

但你不「T需要使用id獲取該元素時，你可以通過直接引用元素本身：

node.setAttribute("onclick","select(this)");

然後：

function select(p) { 
    p.style.backgroundColor="red"; 
    var t = p.innerHTML; 
}

演示：http://jsfiddle.net/QK5Wh/

來源

2013-10-30 22:23:48 nnnnnn

謝謝，它的工作。 –

未能改變節點內容+ JavaScript的

回答

相關問題