如何通过一个循环执行一系列a标签的onclick事件

根据后台数据库动态生成a标签，假设数据库读出的数据如下(共6条)：num[0] = 1;
num[1] = 3;
num[2] = 2;
num[3] = 4;
num[4] = 13;
num[5] = 51;那么我用JS生成6个a标签，如下：<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()。如下：$("#a0").click(function(){myFunction(num[0])});
$("#a5").click(function(){myFunction(num[5])});但数据库提取出来的数据行是不确定的，像上面写肯定不可取。我的想法是能不能通过一个循环来实现，形如：for(var i = 0; i< num.length; i++){
   $("a" + i).click(function(){ myFunction(num[i]); });  //实际上这个代码有问题
}求高手解决！谢谢！

解决方案 »

  1.   

    var num=document.getElementsByTagName('a').length;  //获取页面所以a标签数量。
      

  2.   


    <!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>
    楼主 看看
      

  3.   

    把一个范围的a遍历，绑定单击事件就可以啦
    $("a").each(function(i){
        $(this).bind("click",{MenuIndex:i},function(event){
             myFunction(event.data.MenuIndex);
       })
    })
      

  4.   

    $("a").each(function(i){
      $(this).bind("click",{MenuIndex:i},function(event){
      myFunction(num[event.data.MenuIndex]);
      })
    });
      

  5.   


    <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 href="#" id="a0" value="1">a0</a>
            <br />
            <a href="#" id="a1" value="3">a1</a>
            <br />
            <a href="#" id="a2" value="2">a2</a>
            <br />
            <a href="#" id="a3" value="4">a3</a>
            <br />
            <a href="#" id="a4" value="13">a4</a>
            <br />
            <a href="#" id="a5" value="51">a5</a>
        </div>
    </body>
    </html>
      

  6.   

    谢谢！你这个方法很简洁。我忘了写了一个限制，我页面上还有其它a标签，但这些标签不执行myFunction()函数，请问如何改动呢？
      

  7.   

    不好意思。$("#myId a")这样就实现我的要求了。