Кнопка, созданная динамически с синтаксисом jQuery $ ('<button>'), пуста

Question

Когда я нажимаю кнопку с классом .canActivate, он переводит меня к назначенному div и показывает кнопку.Однако, если я нажму назад и нажму ту же кнопку (или другую кнопку с тем же классом в этом отношении), она покажет только пустую кнопку.В чем проблема?

У меня есть следующий код:

$('.canActivate').live('vclick', function (event) {
    $('#lblServiceName').text($(this).html());
    $('#lblServiceId').text($(this).attr('data-serviceId'));
    $('#lblServiceSubId').text($(this).attr('data-serviceSubId'));
    $('#lblServicePrice').text($(this).attr('data-price'));

    $('#wrapperServiceButtonDiv').empty();
    $('<button type="button" id="btnActivateService" value="Activate" />').appendTo('#wrapperServiceButtonDiv');

    $.mobile.changePage('#serviceDetailsDiv', 'slide', true, true);
});

Answer 1

Во-первых, ваше событие выглядит неправильно. У вас есть:

$('.canActivate').live('vclick', function (event) {

И я уверен, что вы имеете в виду:

$('.canActivate').live('click', function (event) {

Под пустой кнопкой я предполагаю, что вы не имеете в виду текст. Это потому, что вы создали пустую кнопку со строкой:

<button type="button" id="btnActivateService" value="Activate" />

Если вы хотите использовать ярлык, используйте:

<button type="button" id="btnActivateService" value="Activate">Click me</button>

Поскольку вы не опубликовали свой HTML, я не могу понять, почему он работал при первом клике.

Кроме того, вы можете сохранить поиск, добавив в цепочку кнопку «Добавить»:

$('#wrapperServiceButtonDiv').empty().append(
    '<button type="button" id="btnActivateService" value="Activate">Click Me</button>');