Замена button и radiobutton через jQuery replaceWith()
Всем добрый день!
С помощью jQuery и Ajax хочу подменить кнопки на странице. Но при первом нажатии срабатывает, а дальше уже нет. Не могу понять в чем проблема. Буду благодарен за обьяснение!
Код Ajax который вызывает файл PHP:
$(document).ready(function(){
$('.ChangeNum').click(function(){
var elemVal = $(this).attr('value');
console.log(elemVal);
var div_elem = '#abc_' + $(this).attr('value');
var num_data = {
'service' : $(this).attr('value')
};
$.ajax({
type:'post',
url:'get_num.php',
data: num_data
})
.done(function(data){
$(div_elem).html(data);
});
}); });
Код скрипта который вызываю в файле PHP:
$(document).ready(function(){
var radioBut = $("input[name='rad_123']");
console.log(radioBut);
for (var i=0; i<radioBut.length; i++){
var oldVal = radioBut[i].value;
radioBut[i].replaceWith( $('<input type="radio" value=" + oldVal + " name="rad_test_123">\' )[0] );
};
$('button.ChangeImei[value="but_123"]').replaceWith( '<button type="button" class="ChangeNum" value="but_test_123">Change IMEI</button> ').html();
});
Ответы (1 шт):
Во время замены кнопки сбрасываются все ивенты, которые на нее повесили. Фактически - создается новый элемент.
$('.ChangeNum').click() срабатывает только один раз при загрузке страницы и только для тех элементов, которые уже есть в DOM.
Чтобы после обновления все работало, нужно инициализировать следующим образом
$(document).on('click', '.ChangeNum', function() { ваш код здесь })
Это сработает для всех элементов с классом "ChangeNum" - в т.ч. и для тех, которых еще нет на странице.