通过点击HTML列表元素来调用javascript函数

Question

我是网络开发新手，所以这个问题对其他人来说可能太明显了。我想做一个菜单，当点击菜单项时，需要用一个参数调用javascript函数，即项目ID。我想将菜单项目显示为未编号的列表。我不明白的是如何将相同的函数绑定到每个列表项，这将由服务器端PHP脚本生成。

Answer 1

这将有希望让你朝着正确的方向前进。我所做的只是将一个“onClick”事件监听器绑定到所有li元素上，如果您在别处使用它们，您可能需要更改绑定的内容。然后当他们被点击时，他们调用功能myScript，获取他们的ID并发出警报。

JSFiddle Demo

HTML

<ul> 
    <li id="1">Link 1</li> 
    <li id="2">Link 2</li> 
    <li id="3">Link 3</li> 
    <li id="4">Link 4</li> 
    <li id="5">Link 5</li> 
</ul 

的Javascript

var li = document.getElementsByTagName("li"); 

for(var i = 0;i<li.length;i++){ 
    li[i].addEventListener("click", myScript); 
} 

function myScript(e){ 
    alert(e.target.attributes.id.value);  
}