запуск JavaScript на элементе страницы, который был создан с помощью AJAX

Question

Я использую Javascript, чтобы внести некоторые изменения в способ отображения страницы в зависимости от того, что пользователь вводит в форму.Это работает отлично и денди, за исключением одного элемента.Это потому, что этот элемент изменяется с помощью ajax в зависимости от того, что пользователь выбирает ранее в форме.

Я использую document.observe('dom:loaded', function() { для запуска моего кода JS, поэтому очевидно, что этот элемент JS не работает, потому чтодобавлено после того, как дом загружен.Как лучше всего запустить JS на этом элементе страницы после их загрузки?

Спасибо!

Answer 1

Вы можете обрабатывать события в родительском элементе, затем, когда событие срабатывает, вы используете target property из event object, чтобы выяснить, в каком дочернем элементе сработало событие, например, если вы хотите знать, когда кнопка добавлено динамически нажали вы могли сделать:

document.getElementById("parent").click = function(event){
    if(event.target.id=="myButton"){
        //handle click
    }
}

<div id="parent">
    <input type="button" id="myButton" /> <!-- added dinamycally -->
</div>

Используется Событие, всплывающее