使用 jQuery $('<button>') 语法动态创建的按钮为空

Posted

技术标签:

【中文标题】使用 jQuery $(\'<button>\') 语法动态创建的按钮为空【英文标题】:Button created dynamically with jQuery $('<button>') syntax is empty使用 jQuery $('<button>') 语法动态创建的按钮为空 【发布时间】:2011-12-15 15:53:19 【问题描述】:

当我单击带有.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);
);

【问题讨论】:

在问题中包含您的标记可能有助于人们更好地理解您的问题。顺便说一句,您可以使用.data("serviceId") 而不是attr("data-serviceId") 你的很多代码都没有意义...更改文本,然后调用 html??你能粘贴你的html吗:) 【参考方案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>');

【讨论】:

以上是关于使用 jQuery $('<button>') 语法动态创建的按钮为空的主要内容,如果未能解决你的问题,请参考以下文章

单击 HTML 表格并获取行号(使用 Javascript,而不是 jQuery)

jQuery 嵌套 event 会触发多次的原因

jQuery之链式编程

使用 jQuery $('<button>') 语法动态创建的按钮为空

[jQuery]jQuery链式编程

jQuery之排他思想