Question

我遇到了一个问题，即将onclick事件添加到可以在同一页面中多次的对象

我正在尝试

   var i;
   for (i = 1; i<=10; i++) {
    var tmpObj='lov_DgId_D_'+i;
    var tmpObj2=tmpObj.getElementsByTagName('a')[0];
        if (tmpObj2 != null) {
            tmpObj2.onclick= DgIdOnClick;
        }
    }

但得到错误TypeError：

Object lov_DgId_D_1 has no method 'getElementsByTagName' , but this is working 
lov_DgId_D_2.getElementsByTagName('a')[0].onclick= DgIdOnClick;

此ibject lov_DgId_D_可以来自1 like lov_DgId_D_1 or lov_DgId_D_99 u.t.c

为所有lov_DgId_D_ *对象添加onclick的最佳解决方案是什么？

Answer 1

当你使用jquery时，最简单的是

for (i = 1; i<=10; i++) {
    $('#lov_DgId_D_'+ i+ ' a').click(DgIdOnClick);
}

如果要将事件处理程序绑定到id为a的元素内的所有lov_DgId_D_元素，那么它就像

一样简单

$('[id^="lov_DgId_D_"] a').click(DgIdOnClick);

Answer 2

你遇到的问题是元素的id和实际元素之间的混淆。一些应该适合您的代码就是这个：

   var i;
   for (i = 1; i<=10; i++) {
    var tmpObj=document.getElementById('lov_DgId_D_'+i); // <-- here
    var tmpObj2=tmpObj.getElementsByTagName('a')[0];
        if (tmpObj2 != null) {
            tmpObj2.onclick= DgIdOnClick;
        }
    }

稍微容易阅读代码：

for (var i=0; i<=10; i++) {
  var anchor = document.querySelector('#lov_DgId_D_'+i + ' a');
  if (anchor) anchor.onclick = DgIdOnClick;
}

注意：此代码将click事件附加到每个元素内的第一个锚点（a元素），其id为lov_DgId_D_n，其中n为1-> 10。您的原始代码似乎想要做同样的事情。

另一个注意事项：通常当你使用id来迭代元素来识别它们时，你更适合为这些元素添加一个类。它提供了更易于维护的代码，也可能更容易理解。

对于循环或每个与js对象

2 个答案: