Функция javascript, которая пишет html, которая вызывает функцию javascript

Question

Итак, в следующем коде я позволяю javascript писать контест таблицы, но по какой-то причине в результате того, что тело таблицы было сгенерировано таким образом, функция onchange не будет вызвана ? Не знаете, почему или каких-либо решений обойти это.

var table = document.getElementById("tableOfTitles"); 
table.innerHTML = "<tr id='addrow'><td colspan='3'><input type='button' value='+' onclick='addRow()'/><select id='rowType' onchange='addRowDropDownChanged()'>"; 

Весь код для веб-страницы - http://pastebin.com/ywvFywdz

Answer 1

Попробуйте использовать это вместо встроенного JavaScript:

$("#tableOfTitles").on("change", "tr select", function(e) { 
    addRowDropDownChanged(); 
    // Do other stuff here... 
}); 

Это добавит обработчик события к #tableOfTitles, что уже там когда выполняется javascript-код (когда страница загружается). Событие будет запускаться каждый раз, когда элемент tr select внутри него будет изменен.

Обработчики событий регистрируются только один раз. Поэтому, если вы добавите обработчик события в элемент, который еще не существует (или добавьте обработчик впоследствии), тот не будет запущен. Вы можете избежать этого, просто добавив это событие к уже существующему родительскому элементу (в вашем случае #tableOfTitles).