JQuery не работает с компонентами, загруженными $ .post()

Question

Я создаю страницу, загружающую другую страницу внутри div без обновления в качестве шаблона. Но компоненты, которые были спроектированы с помощью запроса JQuery-Ajax, не взаимодействуют с какой-либо функцией, созданной мной с помощью JQuery, похоже, что селекторов этих компонентов не существует.

Ниже я создаю функцию для загрузки страницы в центре шаблона:

function carregaUrl2(url) { 

    var data = $("form").serialize(); 

    $.ajax({ 
     type: "POST", 
     url: url, 
     data: data 
    }).done(function(data) { 
     $("#divCentral").html(data); 
    }); 

} 

Ниже функционального теста, только взаимодействовать с компонентами, созданных JQuery-Ajax запроса:

$(document).ready(function() { 

    $("form").change(function(e) { 
     alert("SUBMIT FORM"); 
     e.preventDefault(); 

     return false; 

    }); 

    $("select").click(function() { 
     alert("INPUT CLICK"); 
    }); 

}); 

Я искал решения, но это было сложно!

Не могли бы вы помочь мне, пожалуйста?

Answer 1

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

$("#divCentral").on("click", "select", function() { 
    alert("INPUT CLICK"); 
}); 

.on() | jQuery API Documentation