динамически добавленные радиокнопки событие onclick не работает?

Question

Я пытаюсь следовать, 1. Получить ответ с помощью Ajax из списка пользователей, который возвращает мне список атрибутов переключателей в виде 2. Как только я получаю список атрибутов, я создаю переключатели, используя createElement () 3. Затем я прикрепляю событие к переключателю для кнопок. 4. Затем я добавляю элемент в DOM, используя appedChild

Ниже приведен код для добавления переключателя (для IE)

var radio = '<input ';
radio += 'type ="radio" ';
radio += 'id="' + id + '" ';
radio += 'value="" ';
radio += '/>';
radioButton = document.createElement(radio);
radioButton.onClick = function(){alert('this is test')}
ele.appendChild(radioButton);
ele.innerHTML += 'none' + '<br/>';

Теперь во всем этом, когда я добавляю переключатель в DOM, онклик не работает, и я не понимаю, почему?

Спасибо всем

Answer 1

Вы можете динамически добавить элемент en в DOM двумя способами: вставив HTML-код в родительский элемент или создав дочерний элемент с некоторыми свойствами. В вашем примере два метода смешаны - поэтому бессмысленно.

Способ 1. Вставка HTML-кода:

var radio = '<input type ="radio" id="' + id + '" value="" />';
ele.innerHTML = radio;
document.getElementById(id).onclick = function(){ alert('this is test'); };

Способ 2. Создание дочернего DOM:

var radioButton = document.createElement('input');
radioButton.type = "radio";
radioButton.id = id;
radioButton.onclick = function(){ alert('this is test'); };
ele.appendChild(radioButton);

Answer 2

свойство называется onclick не onClick