Есть ли способ отключить кучу элементов формы сразу?

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

Теперь эти два входа отключены. Тем не менее, это, похоже, полностью связано с IE8. Входы отображаются отключенными, но я все еще могу их ввести.

Fiddle (Не так, как если бы JsFiddle работал в IE8)

Есть ли кросс-браузерное решение для этой проблемы, без добавления отключенного для каждого элемента формы (что усложняло бы мой скрипт). Возможно, я мог бы сделать что-то сложное, как выбрать

в jQuery, затем .each() через все элементы формы и отключить их – однако я фактически устанавливаю disabled атрибут с помощью привязки Knockout, поэтому на самом деле нет места для добавления такой код. Моим последним средством является использование пользовательской привязки Knockout, которая также отключает все дети, но вздыхает.

Короче: Нет . Причина этого в том, что отсутствие поддержки в IE8 и disabled атрибут в элементе fieldset .

Источник

В IE7 и IE8 атрибут отключает только элементы формы в

.

Я боюсь, что вы должны искать собственное решение, например, ответы других пользователей / собственную собственную привязку.

Хорошо, я придумал конкретную реализацию Knockout.js, которая, надеюсь, поможет некоторым другим людям в одной лодке. Возможно, это решение можно было бы адаптировать для других решений и платформ с небольшими усилиями.

Во-первых, я создал привязку Knockout:

 ko.bindingHandlers.allowEdit = { init: function(element, valueAccessor) { if(!valueAccessor()) { element.disabled = true; element.readOnly = true; if(element.tagName === 'FIELDSET') { $(':input', element).attr('disabled', 'disabled'); } } } }; 

Обратите внимание: вам нужно будет также реализовать метод update если вы хотите разрешить изменения этой привязки. У меня не было этого требования.

Затем вы можете использовать привязку как таковую:

 

Решение с использованием jQuery:

 var disabledFiedset=$('fieldset[disabled]'); $('input',disabledFiedset).attr('disabled','disabled'); 

Я смог сделать что-то подобное с помощью наблюдаемого в моей модели, называемого редактируемым, а затем на моем входе я использовал data-bind="enable: editable” и это полностью работает в IE 7, 8 и 9.

Дайте идентификатор вашему тегу fieldset (или вы также можете использовать имя тега непосредственно в jquery-коде) и используйте следующий код, чтобы все поля были отключены в этом поле, используя jquery.

$ (“# fieldset id” или “fieldset”). children (). attr (“disabled”, “disabled”);