Почему у моей сгенерированной кнопки из jquery нет события?

Question

Почему у моей сгенерированной кнопки из jquery нет события?

<input type='button' value='Populate' id='pop'/> 
<input type='button' value='Click' id='btn'/> 

$('#pop').on('click', function(){ 
    var clone = $('input[id*=btn]').clone(); 
    $(this).after(clone); 
}); 

$('#btn').on('click', function(){ 
    alert('clicked'); 
}); 

fiddle

Answer 1

Вы создаёте клонированную кнопку после Вы использовали приложений для прослушивания. Когда вы клонируете() элемент ТОЛЬКО, структура DOM клонируется, события - нет.

пользователь Либо Event Delegation или просто передать true функции clone(), чтобы он клонировать события также (по the spec)

$('#pop').on('click', function(){ 
    var clone = $('input[id*=btn]').clone(true); // < pass true here 
    $(this).after(clone); 
}); 

DEMO: http://jsfiddle.net/rvhhv8sf/3/

P.S. Идентификатор должен быть уникальным;)

Answer 2

Id должен быть уникальным. Так изменил ваш id btn на класс. Используйте event-delegation. Попробуйте это:

$(document).on('click','.btn', function(){ 
    alert('clicked'); 
}); 

DEMO

Answer 3

Вы копируете идентификаторы, которые не так просто дублировать класс вместо этого.

<input type='button' value='Populate' id='pop'/> 
<input type='button' value='Click' id='btn' class="btn"/> 


$(document).on('click','.btn',function(){ 
    alert('clicked'); 
}); 

Попробуйте это (как на ваш вопрос):

$(document).on('click','#btn',function(){ 
    alert('clicked'); 
}); 

EDIT:

Fiddle ссылка: - http://jsfiddle.net/nLkvejss/

Answer 4

попробовать это:

$(document).on('click', "#btn", function(){ 
    alert('clicked'); 
});