怎么通过一个循环执行一系列a标签的onclick事件
日期：2014-05-16 浏览次数：20381 次
如何通过一个循环执行一系列a标签的onclick事件
根据后台数据库动态生成a标签，假设数据库读出的数据如下(共6条)：
那么我用JS生成6个a标签，如下：
我利用jQuery，在JS文件中为每个a标签定义一个onclick事件，其中id为a0的a标签onclick事件接受num[0]作为参数，id为a5的a标签onclick事件接受num[5]作为参数，再执行我自定义的函数myFunction()。如下：
但数据库提取出来的数据行是不确定的，像上面写肯定不可取。我的想法是能不能通过一个循环来实现，形如：
求高手解决！谢谢！
------解决方案--------------------
根据后台数据库动态生成a标签，假设数据库读出的数据如下(共6条)：
- HTML code
num[0] = 1; num[1] = 3; num[2] = 2; num[3] = 4; num[4] = 13; num[5] = 51;
那么我用JS生成6个a标签，如下：
- HTML code
<a href="#" id="a0"></a> <a href="#" id="a1"></a> <a href="#" id="a2"></a> <a href="#" id="a3"></a> <a href="#" id="a4"></a> <a href="#" id="a5"></a>
我利用jQuery，在JS文件中为每个a标签定义一个onclick事件，其中id为a0的a标签onclick事件接受num[0]作为参数，id为a5的a标签onclick事件接受num[5]作为参数，再执行我自定义的函数myFunction()。如下：
- JScript code
$("#a0").click(function(){myFunction(num[0])});
$("#a5").click(function(){myFunction(num[5])});
但数据库提取出来的数据行是不确定的，像上面写肯定不可取。我的想法是能不能通过一个循环来实现，形如：
- JScript code
for(var i = 0; i< num.length; i++){
$("a" + i).click(function(){ myFunction(num[i]); }); //实际上这个代码有问题
}
求高手解决！谢谢！
------解决方案--------------------
- HTML code
<!DOCTYPE HTML>
<html>
<head>
<meta charset="gb2312" />
<title></title>
<style>
</style>
</head>
<body>
<script>
var arr = [
'测试1',
'测试2',
'测试3',
'测试4',
'测试5',
'测试6'
];
for(var i = 0; i < arr.length; i++){
var a = document.createElement('a');
a.innerHTML = arr[i];
a.href = '#';
(function(i){
a.onclick = function(){
return myFunction(i)
}
})(i);
document.body.appendChild(a);
document.write('<br/>')
}
function myFunction(i){
alert(i)
}
</script>
</body>
</html>
------解决方案--------------------
$("a").each(function(i){
$(this).bind("click",{MenuIndex:i},function(event){
myFunction(num[event.data.MenuIndex]);
})
});
------解决方案--------------------
- HTML code
<html>
<head>
<title></title>
<script type="text/javascript">
window.onload = function () {
var aLinkListElement = document.getElementById("aLinkList");
aLinkListElement.onclick = function (e) {
e = e || window.event;
var srcElement = e.target || e.srcElement;
var elementName = srcElement && srcElement.nodeName;
if (!elementName) {
return;
}
if (elementName.toUpperCase() != "A") {
return;
}
aOnclick(srcElement.getAttribute("value"));
}
}
function aOnclick(value) {
alert(value);
}
</script>
</head>
<body>
<div id="aLinkList">
<a h
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
