这个 JQuery 哪里错了？答案

【问题标题】：Where is this JQuery wrong?这个 JQuery 哪里错了？
【发布时间】：2010-10-12 13:09:09
【问题描述】：

我想将点击事件添加到 `id="violacao": 的所有元素

$(document).ready(function () {
    jQuery('#violacao').click(function() {
        alert('teste');
    });
});

但只有第一个链接会响应点击。这是生成的 HTML：

<tr>
  <td><a href="#" id="violacao">40954589</a></td>
  <td>Perda de Comunicação</td>
</tr>

<tr>
  <td><a href="#" id="violacao">88692020503</a></td>
  <td>Perda de Comunicação</td>
</tr>

当我尝试这种方式时：

jQuery("a").click(function() {
    alert('teste');
});

它工作正常，除了所有链接都受到影响。怎么了？

【问题讨论】：

标签： javascript jquery css-selectors

【解决方案1】：

HTML 中的 ID 是唯一的（每个文档一个）。将 ID 更改为一个类（并使用 . 而不是 #），它应该可以工作。

【讨论】：

如果你有'violacao' id的CSS定义，请相应调整

【解决方案2】：

虽然史蒂夫·梅森说的是真的，但实际问题并非如此。

如果您将 ID 更改为类，问题仍然存在：所有链接都会受到影响。

相反，如果您的目标是影响单个，您应该执行以下操作之一：

a) 为每个分配唯一的 ID，然后像你之前那样做；或

b) 分配类并使用 :first 选择器：

jQuery("a.violacao:first").click( function (){
  alert('teste');
} );

这将适用于具有 violacao 类的第一个匹配锚。或者，如果你想影响一个特定的锚，你可以使用 :eq(index)。

有关选择器的完整列表，请访问http://docs.jquery.com/Selectors。

【讨论】：

SebaGR 误读了这个问题，我想。选择一个链接不是发布者想要的，而是问题的一部分。在这种情况下，类解决方案是正确的，并且没有选择所有链接。只是想澄清一下。
我不这么认为......他说“它工作正常，除了所有链接都受到影响。”，所以我相信“除了”这个词告诉我们期望的行为是只选择一个锚。
“它工作正常，除了所有链接都受到影响。”评论是在他尝试 $('a').click(...) 方法的示例之后，显然这会影响所有链接。实际问题出在第一个示例中，这归结为重复 ID。
@Steve：如果他更改了类的 ID，相同的行为仍然存在......所有链接都会触发。我敢打赌，他实际上为解决这个问题所做的就是按照您的建议分配不同的 ID，效果很好。这就是我要说的：更改为 == 类并不能解决问题；分配唯一 ID 确实如此。
SebaGR：我建议如果您想进一步讨论这个问题，请返回并仔细阅读原始问题。期望的行为是选择包含某个标识符的多个链接 - 问题的第一句话。在这种情况下，按类使用和选择是完美的解决方案。