Чтобы назначить OnClick события на несколько кнопок

Question

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

for(var loop = 0; loop < up.length ; loop++){ 
document.write('<button style="background-color:'+ up[loop] +';width:100;height:100" </button>'); 

} 

однако я хочу иметь такое же OnClick функции для каждой кнопки, но если я использую как один ниже функция не выполняется. В чем проблема и где я ошибаюсь? Пожалуйста помоги.

document.write('<button style="background-color:'+ up[loop] +';width:100;height:100" onclick= "myfn()" </button>'); 

Answer 1

, что о чем-то вроде этого (не JQuery необходимо, и не document.write):

var button; 
for (i=0; i<5; i++) { 
    button = document.createElement('button'); 
    button.innerHTML = "button - " + i; 
    button.addEventListener('click', myFn); 
    document.body.appendChild(button); 
} 


function myFn() { 
    alert('button clicked'); 
} 

посмотреть здесь: http://jsfiddle.net/yNFqy/1/

Answer 2

опечатка, вы не закроете открывающий тег:

document.write('<button style="background-color:'+ up[loop] +';width:100;height:100" onclick="myfn()"></button>'); 

Всегда убедитесь, что вы утвердите службы проверки разметки W3c: http://validator.w3.org

Вы должны также исследовать ненавязчиво крепления обработчики событий , написание обработчиков inline не является идеальным.

Answer 3

1. Использование JQuery
2. Добавьте класс кнопок (всегда же класс)
3. Пользователь метод нажмите Jquery, чтобы обработать щелчок

$ (имя-класса».) .click (function() {alert ("click");});