jquery для получения неуникальных идентификаторов из DOM

Question

скажем, у меня есть эти два div с уникальным идентификатором и входными элементами, которые не являются входами с уникальным идентификатором.

<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_days_0').attr('checked')

Есть ли способ сфокусироваться только на одном входном идентификаторе из определенного div?

Answer 1

Как упоминалось ранее, вы всегда должны делать свои идентификаторы уникальными, и подмена класса будет хорошим подходом.

С учетом сказанного вы можете ссылаться на необходимые элементы следующим образом:

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

Как уже было сказано: идентификаторы должны быть уникальными, поэтому вам нужно изменить свой дизайн.

Например, вы можете использовать классы, они не обязательно должны быть уникальными:

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

Теперь вы можете использовать jQuery, чтобы найти правильный ввод, используя:

$('#column_0 .class_days')

Answer 3

Это плохая практика, никакие два элемента на одной странице не должны иметь одинаковый идентификатор. Лучшим методом было бы иметь

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

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

Тогда вы можете найти # column1 и отфильтровать до .days_0

Answer 4

Вы никогда не должны дублировать идентификаторы!

Однако это работает в Chrome:

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

Answer 5

Добавление родителя к вашему селектору должно помочь:

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