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

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

<fieldset disabled>
    <input value="one" />
    <input value="two" />
</fieldset>

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

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

Есть ли кросс-браузерное решение для этой проблемы, без добавления отключенного для каждого элемента формы (что усложняло бы мой script). Возможно, я мог бы сделать что-то сложное, как выбрать <fieldset> в jQuery, затем .each() через все элементы формы и отключить их - однако я фактически устанавливаю атрибут disabled с помощью привязки Knockout, поэтому на самом деле нет места для добавьте такой код. Мое последнее средство - использовать пользовательскую привязку Knockout, которая также отключает все дети, но вы можете вздохнуть.

ОТВЕТЫ

Ответ 1

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

Источник

В IE7 и IE8 атрибут отключает только элементы формы в < легендa > .

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

Ответ 2

Хорошо, я придумал конкретную реализацию 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, если вы хотите разрешить изменения этой привязки. У меня не было этого требования.

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

<fieldset data-bind="allowEdit: someExpression">
   <input value="One" />
   <input value="Two" />
</fieldset>

Ответ 3

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

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

Ответ 4

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

Ответ 5

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

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