Доменный объект, написанный на HTML, загруженный Ajax

Question

Я представил часть HTML от Ajax.

мой HTML

<div class="article-feed">
    // html is loaded here.
</div>

AJAX

var url = 'getpageplaceinfo/0';
$.ajax({
    type:'GET', 
    url: url, 
    dataType: 'html'
}).done(function(data){
    $('.article-feed').append(data); 
}   

Здесь загружается HTML вот так

myname        
<input type="checkbox" name="place" value="1">

он корректно загружает чекбо, но когда я пытался получить ход чекбо, он не работает

$('input[name=place]').on('change', function(){
// not being called

Это правильное поведение ??

или как мне справиться с динамически загруженным input ??

Answer 1

Это связано с тем, что указанное вами событие связывается при первом запуске кода и не будет работать с динамическими объектами, созданными после этого времени.

В качестве альтернативы вы можете связать динамические элементы управления с помощью следующего:

$('body').on('change', 'input[name=place]', function() {...

При этом будет обнаружен любой объект (динамический или статический), соответствующий селектору input[name=place].

Answer 2

Вы пробовали использовать это?

$('input[name=place]').on('click', function(){})

Answer 3

Вы должны прикрепить слушателя после добавления HTML.

    var url = 'getpageplaceinfo/0';
    $.ajax({
        type:'GET', 
        url: url, 
        dataType: 'html'
    }).done(function(data){
        $('.article-feed').append(data); 
        $('input[name=place]').on('change', function(){
            // handle change
        }
    }