Question

我正在尝试在“Deltree”div上运行.each函数，为每个div选择.attr('class')并提醒我它的值，但它只在deltree div的第一个上工作。这是我的表：

<table width="100%" style="border:1px solid #ccc;">
<tbody>

<tr id="links"><td id="linkname"><a href="http://www.vg.no">vg</a></td><td id="link"><a href="http://www.vg.no">http://www.vg.no</a></td><td>&nbsp;</td><td>&nbsp;</td><td><div class="1" id="deltree">Slett</div></td></tr>

<tr id="links"><td id="linkname"><a href="http://www.dt.no">test</a></td><td id="link"><a href="http://www.dt.no">http://www.dt.no</a></td><td>&nbsp;</td><td>&nbsp;</td><td><div class="2" id="deltree">Slett</div></td></tr>

<tr id="links"><td id="linkname"><a href="http://www.vg.no">vg2</a></td><td id="link"><a href="http://www.vg.no">http://www.vg.no</a></td><td>&nbsp;</td><td>&nbsp;</td><td><div class="3" id="deltree">Slett</div></td></tr></tbody></table>

这是我的剧本：

$(document).ready(function(){
 $('#links').each(function() {
    $('#deltree').click(function() {
    var lid = $(this).attr("class");  
    var dataString = 'lid='+ lid;  
alert(dataString);
    }); 
    }); 
  });

当我点击其他2个div时，它只是拒绝提醒我，我无法弄清楚原因。非常感谢任何帮助。

Answer 1

id应该是每页唯一的 - 所以jQuery找到第一个元素（我猜想使用getElementById函数），处理它并停止。您应该使用name属性和相应的jQuery选择器（$('div[name="deltree"]')）。

示例代码

表：

<table width="100%" style="border:1px solid #ccc;">
<tbody>

    <tr id="links">... skipped ...<div class="1" name="deltree">Slett</div></td></tr>

    <tr id="links">... skipped ...<div class="2" name="deltree">Slett</div></td></tr>

    <tr id="links">... skipped ...<div class="3" name="deltree">Slett</div></td></tr></tbody></table>

脚本：

$(document).ready(function(){
 $('#links').each(function() {
    $('div[name="deltree"]').click(function() {
    var lid = $(this).attr("class");  
    var dataString = 'lid='+ lid;  
alert(dataString);
    }); 
    }); 
  });

Answer 2

使用类代替 id ，然后使用$（“。classname”）选择器.Ids必须是独一无二的。

Answer 3

如果您有多个具有相同id的元素，则无法确切知道会发生什么 id应该是唯一的。

将id更改为name

<table width="100%" style="border:1px solid #ccc;">
<tbody>

<tr name ="links"><td id="linkname"><a href="http://www.vg.no">vg</a></td><td id="link"><a href="http://www.vg.no">http://www.vg.no</a></td><td>&nbsp;</td><td>&nbsp;</td><td><div class="1" id="deltree">Slett</div></td></tr>

<tr name="links"><td id="linkname"><a href="http://www.dt.no">test</a></td><td id="link"><a href="http://www.dt.no">http://www.dt.no</a></td><td>&nbsp;</td><td>&nbsp;</td><td><div class="2" id="deltree">Slett</div></td></tr>

<tr name="links"><td id="linkname"><a href="http://www.vg.no">vg2</a></td><td id="link"><a href="http://www.vg.no">http://www.vg.no</a></td><td>&nbsp;</td><td>&nbsp;</td><td><div class="3" id="deltree">Slett</div></td></tr></tbody></table>

$(document).ready(function(){
    $('input[name=links]').each(function() {
        $('#deltree').click(function() {
        var lid = $(this).attr("class");  
        var dataString = 'lid='+ lid;  
        alert(dataString);
        }); 
    }); 
  });

表中的jQuery .each函数无法正常工作

3 个答案: