Question

说我有这两个唯一ID'd的div，输入元素不是唯一的ID输入。

<div id="column1" >
    ...
    <input checked="checked" type="checkbox" name="days" value="1" id="id_days_0" />
</div>

<div id="column2" >
    ...
    <input checked="checked" type="checkbox" name="days" value="1" id="id_days_0" />
</div>

如何根据顶级div ID区分两个输入？

显然，这不起作用：

$('#id_days_0').attr('checked')

有没有办法只关注特定div中的一个输入ID？

Answer 1

如前所述，您应该始终使您的ID唯一，并且替换一个类将是一个很好的方法。

话虽如此，您可以参考以下所需的项目：

HTML：

<div id="column1" >
    First <input checked="checked" type="checkbox" name="days" value="Chk1" id="id_days_0" />
</div>
<div id="column2" >
    Second <input checked="checked" type="checkbox" name="days" value="Chk2" id="id_days_0" />
</div>

JavaScript的：

alert("Check1 = "+$("#column1 #id_days_0").val()+"\n"+"Check2 = "+$("#column2 #id_days_0").val());

此可以工作的原因是由于首先引用父对象，然后是子对象引用对象。

工作示例：http://jsfiddle.net/8VqtE/

Answer 2

向选择器添加父级应该可以解决问题：

$('#column1 #id_days_0')
$('#column2 #id_days_0')

Answer 3

这是不好的做法，同一页面上的两个元素不应该具有相同的ID。

是一个更好的方法

<div id="column1">
    <input ... class="days_0" />

</div>
<div id="column2">
    <input ... class="days_0" />
</div>

然后你可以找到＃column1，并过滤到.days_0

Answer 4

你永远不应该重复ID！

但是，这适用于Chrome：

$('#column2').find('#id_days_0')

Answer 5

如前所述：ID 必须是唯一的，因此您需要更改设计。

例如，您可以使用类，这些类不需要是唯一的：

<input type="checkbox" name="days" value="1" class="class_days" />

现在您可以使用jQuery查找正确的输入：

$('#column_0 .class_days')

jquery从DOM获取非唯一ID

5 个答案: