Disabled true не работает

1) IE свойства id и name, нужны для совместимости со старыми версиями, а не для удобства.
т.е. id и name должны быть равны.
А для работы с коллекциями есть специальный метод document.body.createControlRange()

2) Ваш код не поддерживает кросс-броузерность
3) Код состоит из одних ошибок
document.getElementById(‘button2’) // возвращает первый элемент коллекции

input type=»hidden»
form1.button2.disabled!=form1.button2.disabled // далее наложение визуальных эффектов на скрытый элемент

Источник

Добавление и удаление DOM-свойств на jQuery

В этой статье разберём методы jQuery для чтения, добавления, изменения и удаления DOM-свойств. На практике подробно остановимся на рассмотрении таких свойств как disabled, checked и selected.

Что такое DOM-свойства элементов

Когда браузер получает HTML-код запрашиваемой страницы, он разбирает его и строит в соответствии с ним DOM-дерево. При этом HTML-теги становятся объектами (узлами этого дерева), а атрибуты — их свойствами. При этом значения DOM-свойств может отличаться от соответствующих им атрибутов. Почему так происходит, а также более подробно узнать про DOM-свойства и атрибуты, и чем они отличаются друг от друга, можно в этой статье.

В качестве заключения можно отметить, что в большинстве случаев нужно работать с этими сущностями как с DOM-свойствами, а операции с атрибутами оставлять только для реализации тех моментов в которых это действительно нужно.

Атрибуты disabled, checked, selected и т.п

Значения атрибутов ( disabled , checked , selected , hidden , readonly и т.п.) отличиаются от соответствующим им DOM-свойств. При этом значение атрибута — это всегда строка, а DOM-свойства — нет. Разные DOM-свойства могут иметь разные типы данных. Например, DOM-свойства disabled , checked , selected и другие, подобные этим, имеют логический тип.

Как в этом случае определяется значение этих DOM-свойств? Этот процесс описан в стандарте. В ооответсвии с ним, значение этих DOM-свойств ( disabled , checked и т.п.) равно true , когда такой атрибут присутсвует у тега и при этом не важно какое он имеет значение. В противном случае значения таких DOM-свойств равны false .

Методы jQuery для управления DOM-свойствами

В jQuery имеется два метода для управления DOM-свойствами элементов.

Первый метод — это prop .

Метод prop

Метод prop предназначен для выполнения различных операций над DOM-свойствами элементов.

Первая операция — это чтение значения DOM-свойства.

Синтаксис метода prop для получения значения DOM-свойства:

Пример, в котором рассмотрим принцип получения значения DOM-свойств с помощью метода prop :

Но DOM-свойства для элементов создаются не только в соответствии с теми атрибутами, которые есть у каждого из них в HTML. Для каждого элемента в соответствии с его встроенным классом создаётся целый набор стандартных для него DOM-свойств. Например, для элемента input (его класс HTMLInputElement ) создаётся один набор DOM-свойств, а для элемента a (его класс HTMLAnchorElement ) создаётся немного другой, но стандартный уже для него набор DOM-свойств.

Пример, в котором изменим значения DOM-свойств элемента:

Воторая операция — это изменение значения DOM-свойства.

Синтаксис метода prop для установления DOM-свойству нового знчаения:

Кроме этого варианта jQuery предлагает ещё два:

Пример, в котором изменим значения DOM-свойств элементов:

Пример, в котором установим заголовкам h2 и h3 , находящихся в элементе .article , идентификаторы, если их у данных элементов нет:

Удалить стандартное DOM-свойство у элемента нельзя. Но вы можете установить ему значение по умолчанию.

Пример, в котором установим для некоторого элемента, например button , значение DOM-свойства равным false .

Сейчас данный элемент в качестве значения DOM-свойства disabled имеет значение true , т.к. атрибут disabled присутствует у тега.

Теперь установим данному DOM-свойству значение false . Это изменение также повлияет на соответствующий ему атрибут. Он будет убран у элемента.

Пример, в котором переведём кнопку submit в активное состояние (т.е. установим ей свойство disabled равное false ) когда содержимое элемента input[name=»search»] не будет равно пустой строке:

Принцип работы с checked ничем не отличается от disabled .

Примеры работы с checked

1. Пример, в котором установим флажок checkbox, а затем снимем его у него через 5 секунд:

2. Пример, в котором будем перед отправкой формы проверять состояния checkbox #agree , и если он не установлен в true , то выводить некоторое сообщение и отменять отправку формы на сервер.

3. Пример, в котором выполним две операции, связанные с checked . Первое — это установим после загрузки страницы второму элементу radio состояние checked , равное true . Второе — это создадим обработчик для события change , который будет выводить в #log значение выбранного переключателя:

Пример работы с selected

Пример, в котором выполним несколько действий. Первое — это установим состояние selected второму option . Второе — это создадим обработчик для события change , который будет выводить в #log выбранный пункт.

Пользовательские DOM-свойства

Элементы в DOM не ограничиваются перечнем только стандартных (встроенных) для каждого из них свойств. К любому элементу в DOM пользователь может добавить свои собственные свойства.

По сути, DOM элементы (узлы) – это обычные объекты JavaScript. Следовательно, к ним, как и к любым другим объектам можно добавлять свои свойства.

Осуществляется это также с помощью метода prop. Данный метод используется, когда нужно добавить, изменить или прочитать пользовательское DOM-свойство.

Рассмотрим добавление собственного DOM-свойства к элементам на следующем примере.

В этом примере добавим к элементам .counter пользовательское DOM-свойство count , которое будем использовать для хранения количество нажатий (click-ов):

Пользовательские DOM-свойства не отображаются в HTML коде и ни каким образом не сказываются отрисовку этого элемента на странице.

Удаление пользовательского DOM-свойства у элемента осуществляется с помощью метода removeProp .

Синтаксис метода removeProp:

Данный метод предназначен исключительно для удаления собственных DOM-свойств. Удалить стандартные (встроенные) DOM-свойства у элементов нельзя, вы можете им просто установить значение по умолчанию.

Пример, в котором будем добавлять и удалять у элемента #paragraph пользовательское DOM-свойство при нажатии соответственно на ту или иную кнопку:

Управление состоянием checked, disabled, selected через атрибуты

Изменять состояние checked, disabled, selected более предпочтительно через соответствующее DOM-свойство.

Но, тем не менее можно выполнять это и через атрибуты.

Например, чтобы перевести кнопку в неактивное состояние (disabled), ей нужно просто добавить атрибут disabled .

Для выполнения обратного действия, перевода элемента в активное состояние у него нужно удалить этот атрибут:

Для управления состоянием checked , readonly необходимо выполнять аналогичные действия.

В приведённом выше примере мы добавляли и удаляли атрибут disabled у элемента. При этом браузер при изменении атрибута изменял и значение соответствующему ему DOM-свойству. Т.е. при добавлении атрибута disabled устанавливал соответствующему DOM-свойству в данном случае disabled значение true , а при удалении этого атрибута – устанавливал false .

Браузер также при изменении значения DOM-свойства элемента, изменяет и его атрибут. Для DOM-свойств с логическим типом это работает так, с другими по-другому. Например, с id , class и style изменения происходяи один к одному, а например, с value изменения один к одному не работают.

Статья, которая может быть вам также интересной:

Источник

Поменять значение disabled в input

Есть две радиокнопки:

Как сделать, чтобы при нажатии на radio «безналичными» атрибут инпута disabled отключался, и наоборот, чтобы включался при нажатии на radio «наличными»?

3 ответа 3

jQuery 1.6+

disabled — это не просто атрибут в HTML-коде, это специальное свойство у объекта HTMLInputElement , значение которого имеет тип Boolean, поэтому в jQuery его правильнее всего менять с помощью метода .prop() :

jQuery 1.5 и более старые

В старых версиях .prop() отсутствует, так что придётся откатываться до .attr() (это некрасиво, но тем не менее тоже работает благодаря специальному костылю).

(использовать removeProp для ранее упомянутого специального свойства disabled нельзя!)

О том, что это некрасиво, говорит сама документация jQuery:

[As of jQuery 1.6, ], To retrieve and change DOM properties such as the checked , selected , or disabled state of form elements, use the .prop() method.

В любой версии jQuery или совсем без него

Если любыми путями достать настоящий DOM-объект ( HTMLInputElement ), то можно просто взять и поменять у него свойство disabled без всяких jQuery (правда, это будет применимо только к одному элементу за раз, в то время как jQuery умеет переключать disabled сразу пачке элементов, но сейчас не об этом).

Например, если повесить на требуемый элемент обработчик какого-нибудь события (без bind ), то значением this там будет DOM-элемент, и тогда:

Или можно достать DOM-элемент из jQuery-объекта:

Выше был вольный перевод ответа с английского Stack Overflow с дополнениями. Если применить данные знания к вашей задаче, то получится как-то так:

Источник

Вам также может понравиться

Как в телевизоре убрать безопасный режим

По умолчанию в телевизоре могут стоять задачи, которые

Домашний кинотеатр. Улучшаем параметры

Для того, чтобы улучшить качество изображения и звука

Как починить наушники в случае их поломки

Не у каждого человека в доме есть паяльник.

Настраиваем и подключаем комнатную антенну

Не получится просматривать цифровое кабельное телевидение