Question

我正在动态更改提醒消息：

<div id="alert" hidden="hidden">
 <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
</div>

$('#alert').addClass("alert alert-danger alert-dismissable")
    .text('Fail to get upload information from YouTube.')
    .show();

但是没有显示关闭按钮。

Answer 1

使用.append而不是.text：Working demo here

$('#alert').removeClass('alert alert-info alert-dismissable').addClass("alert alert-danger alert-dismissable").append('Fail to get upload information from YouTube.').show();

Answer 2

执行.text（）方法后，您最终会更改div＃alert的整个内容。但是，按照你的问题，似乎你只想将文本附加到div，保持div内的按钮完好无损。

可以使用.append（）方法来实现。

这应该有效：

$('#alert').addClass("alert alert-danger alert-dismissable")
.append('Fail to get upload information from YouTube.')
.show();

正如您要求更换现有文字一样，我建议： 1）将前一个文本放在稍后可以引用的范围内 2）取消隐藏div＃alert，同时用新消息更改子跨度的文本，保留div内的所有其他内容。

例如：如果你有这样的html：

<div id="alert" hidden="hidden">
 <button type="button" class="close" data-dismiss="alert" aria-hidden="true">Hello</button>
 <span id="message">Text before script execution</span>
</div>

然后以下脚本将正常工作：

$('#alert').addClass("alert alert-danger alert-dismissable")
    .show()
    .children('#message').text("Text after script execution");

PS：稍后如果您希望在span中添加html内容，那么.html（）将适合您，而.text（）只会将内容视为文本而不会呈现为HTML代码。

Answer 3

我能想到的最简单的解决方案只是对代码的一个小修改。

<div id="alert" hidden="hidden">
 <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
</div>

$('#alert').addClass("alert alert-danger alert-dismissable")
    .text('Fail to get upload information from YouTube.')
    .append('<button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>')
    .show();

这应该做你想要的。该按钮消失，因为它不再是div标记的一部分。使用append()添加它会在您想要放入div的任何文字之后添加它。

警报解除按钮未显示

3 个答案: