Question

为什么jQuery在这里两次返回相同的元素？

多次检查HTML，只有<div> id="3"和class="password_field_real"。

这是获取class="password_field_real"所有元素的结果：

> $(".password_field_real")

[
    <div class="password_field_real" id="2" style="display: none;"></div>, 
    <div class="password_field_real" id="3" style="display: none;"></div>,
    <div class="password_field_real" id="7" style="display: none;"></div>,
]

但是，当我尝试获取class="password_field_real"和id="3"时，我会得到两个div的列表，它们是相同的！

> $("#3.password_field_real")

[
    <div class="password_field_real" id="3" style="display: none;"></div>,  
    <div class="password_field_real" id="3" style="display: none;"></div>
]

其他两个div不是这样的：

> $("#7.password_field_real")

[
    <div class="password_field_real" id="7" style="display: none;"></div>
]

为什么会发生这种情况？

*更新*

Reproduced这在jsFiddle

中

*更新＃2 *

如果使用非数字身份证，则works just fine。

Answer 1

首先，id在页面上必须是唯一的。这就是背后的想法。

您的问题是您使用了无效的ID选择器（根据HTML4）：

ID和NAME令牌必须以字母（[A-Za-z]）开头，可能是   后跟任意数量的字母，数字（[0-9]），连字符（“ - ”），   下划线（“_”），冒号（“：”）和句点（“。”）。

在其他doctypes中有不同的限制，但您总是至少需要一个字母。由于您只使用数字，因此无效。当你使用非数字身份证的时候，这可能就是一个解释。仍然是jQuery的一些奇怪的行为。

使用至少一个字母[A-Za-z]添加您的ID，或者甚至更好，使其具有描述性。

Answer 2

永远不要多次使用相同的id，id必须是UNIQUE

alert( $("#3").length ); // will just return 1 not 8

这个真正愚蠢的代码只是选择你的好的，但从不使用它，将导致世界末日

alert( $("#3").find("#3").filter(".password_field_real").attr("class") );

如果您需要每个子“div”和“a”的当前ID，请尝试数据 - 为什么不是这样的代码

$(".password_entry").each(function(){
    var $t = $(this);
    var currentId = $t.attr("id");
    $t.find("div,a").data("id",currentId);
});

现在你可以用.data（“id”）

从所有子“div”和“a”中提取当前id

例如：

$(".password_field_mask").click(function(){ alert( $(this).data("id") ); });

按元素ID +元素类选择会产生两次相同的元素

2 个答案: