В internet explorer ниже 8 версии существует такая проблема: при динамическом создании радио инпутов, они(инпуты) отображаются неактивными(т.е. невозможно выбрать инпут кликом по нему).
В остальных браузерах, динамически создать набор радиобаттонов можно, например, так:
В остальных браузерах, динамически создать набор радиобаттонов можно, например, так:
var radio1 = document.createElement('input');
radio1.setAttribute('type', 'radio');
radio1.setAttribute('name', 'myRadioName');
radio1.setAttribute('value', 0);
radio1.setAttribute('checked', true);
var radio2 = document.createElement('input');
radio2.setAttribute('type', 'radio');
radio2.setAttribute('name', 'myRadioName');
radio2.setAttribute('value', 1);
var radioset = document.getElementById('radioset');
radioset.appendChild(radio1);
radioset.appendChild(radio2);
* This source code was highlighted with Source Code Highlighter.
Оказалось, что в ie созданные таким способом радиобаттоны переключать невозможно.
Почему?
Ответ был найден на-самом-главном-сайте-ms, где указано, что:
Пользователь может выбирать тольке те радиобаттоны, у которых есть атрибут name
Как вы догадались, это еще не обьясняет неработоспособность приведенного выше кода, так как атрибут name там устанавливается с помощью метода setAttribute.
Покопавшись еще немного там же, можно узнать, что:
ie8 может устанавливать атрибут name для элементов, созданных динамически, с помощью метода createElement
А это, дорогие друзья, означает, что остальные версии недобраузера этого делать не могут(Разве это не прекрасно). Как же жить то тогда дальше?
Решение
Далее там же указывается, что:
Для того, чтобы установить атрибут name в более ранних версиях, необходимо вставлять атрибут и его значение сразу в метод createElement
То есть для вышеприведенного примера надо писать так:
var radio1= document.createElement('<input type="radio" name="q" value="0" checked />');
var radio2= document.createElement('<input type="radio" name="q" value="1" />');
var radioset = document.getElementById('radioset');
radioset.appendChild(radio1);
radioset.appendChild(radio2);
* This source code was highlighted with Source Code Highlighter.
Учтите, это работает только в ie.
Также можно использовать innerHTML родительской ноды. Например:
var lab1= document.createElement('label');
lab1.innerHTML = 'I hate IE <input type="radio" name="q" value="0" checked />'
var lab2= document.createElement('label');
lab2.innerHTML = 'I love IE <input type="radio" name="q" value="0" disabled />'
var radioset = document.getElementById('radioset');
radioset.appendChild(lab1);
radioset.appendChild(lab2);
* This source code was highlighted with Source Code Highlighter.
Спасибо за внимание. Надеюсь, это окажется для кого-то полезным.