如何通过点击列表项目元素来调用警报窗口？

Question

任何人都可以请我的简单脚本帮助我吗？我有一个html代码中的颜色列表，只需要让我的js代码弹出一个警报与点击列表项值。请帮帮我！以下是我有：

HTML

<ul id="mylist"> 
    <li>White </li> 
    <li>Silver </li> 
    <li>Dark Gray</li> 
    <li>Khaki </li> 
</ul> 

这里是JS代码（它显示与窗口加载列表项值的警报，但我需要它点击每个后出现项）

<script language="JavaScript"> 
<!-- 
    var a = document.getElementById('mylist').document.getElementsByTagName('li'); 
    var b=[]; 
    for(i=0;i<a.length;i++) 
    { 
    b=a[i].innerText; 
    alert(b); 
    } 
//--> 
</script> 

Answer 1

var a = document.getElementById('mylist').getElementsByTagName('li'); 

for(var i = 0; i < a.length; i++){ 
     a[i].onclick = function(){ 
      alert(this.innerHTML); 
     } 
} 

演示：http://jsbin.com/ayefap/2/

Answer 2

var a = document.getElementById('mylist').getElementsByTagName('li'); 

document.getElementById("myList")没有.document

如果你使用Firebug或Chrome控制台你那里得到这个错误。

Answer 3

document.getElementById('mylist').addEventListener('click', function(event) { 
    if ('LI' != event.target.tagName) return; 
    alert(event.target.innerText); 
}, false); 

参见：

• https://developer.mozilla.org/en/DOM/event.target
• https://developer.mozilla.org/en/DOM/element.addEventListener

Answer 4

没有进入原始的JavaScript挂钩点击处理程序，你可以这样做：

<li><a href="javascript://" onclick="alertMe(this)">White</a></li> 

个

JS：

function alertMe(element) { 
     alert(element.innerText) 
} 

Answer 5

<ul id="mylist"> 

    <li><a href="javascript:void(0)" onclick="clickMe(this)">White</a></li> 
     <li>Silver </li> 
      <li>Dark Gray</li> 
       <li>Khaki </li> 
</ul> 

添加到您的头部分：

<script type="text/javascript"> 
function clickMe(cid){ 
alert(cid.innerHTML); 

} 
</script>