Использование jQuery для ссылки на поля формы в массиве

Question

У меня есть HTML-форма, которая выглядит примерно так:

<td><input type='checkbox' id='a[] '><input type='text' id='b[]'></td>
<td><input type='checkbox' id='a[] '><input type='text' id='b[]'></td>

В функции jQuery я хотел бы включить / отключить связанный ввод текста - b, когда установлен флажок.

Я не уверен, как можно ссылаться на каждое поле отдельно в функции jQuery .click () при использовании массива.

Любая помощь будет высоко ценится!

Answer 1

Концепция похожа на Thomas, но выполняется при загрузке страницы и добавляет .focus () для хорошей меры:

$(function(){
    var toggleState = function(){
        if($(this).is(':checked'))
            $(this).next('[name="b"]').removeAttr('disabled').focus();
        else
             $(this).next('[name="b"]').attr('disabled','disabled');
    };
   //bind event and fire off on page load
    $('input[name="a"]').bind('click',toggleState).each(toggleState);
})

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

<table>
 <tr><td><input type='checkbox' name='a'><input type='text' name='b'></td></tr>
 <tr><td><input type='checkbox' name='a'><input type='text' name='b'></td></tr>
</table>

http://jsfiddle.net/R28dV/4/

Answer 2

Удалите атрибут disabled, чтобы разрешить ввод.Установите атрибут disabled на любое значение, обычно «отключенное», чтобы отключить ввод.Установка disabled="" недостаточно хороша, просто наличие атрибута отключает ввод.Вы должны удалить атрибут.

$("input[type=checkbox]").click(function()
{
    if (this.checked) $(this).next().removeAttr("disabled");
    else $(this).next().attr("disabled", "disabled");
});

Answer 3

Попробуйте это (я уверен, что есть более краткий способ, но у меня нет IntelliSense здесь LOL)

$("checkbox").click(function(){
 if($(this).next().attr("disabled") == "disabled") {
$(this).next().attr("disabled", "");
}
else {
$(this).next().attr("disabled", "disabled");
}
});

Answer 4

Ваш HTML-код недействителен, если у вас есть повторяющиеся идентификаторы. Дайте им уникальные идентификаторы, чтобы ваш HTML снова стал действительным, и ваша проблема также будет решена.