javascript - 当我更新 bs3 中的组列表时，我丢失了字形图标

Question

这是我的 html

    <div class="list-group">
        <a href="#" id="lblChoice0" class="list-group-item">zero<i id="0" class="icon-volume-up icon-2x"></i></a> 
        <a href="#" id="lblChoice1" class="list-group-item">one<i id="1" class="icon-volume-up icon-2x"></i></a>
        <a href="#" id="lblChoice2" class="list-group-item">two<i id="2" class="icon-volume-up icon-2x"></i></a>
        <a href="#" id="lblChoice3" class="list-group-item">three<i id="3" class="icon-volume-up icon-2x"></i></a>
        <a href="#" id="lblChoice4" class="list-group-item">four<i id="4" class="icon-volume-up icon-2x"></i></a>
    </div>

我正在使用从我的数据库读取的 js ajax 更改组列表的文本，代码如下:

    $('#lblChoice0').html(msg.d[0]);
    $('#lblChoice1').html(msg.d[1]);
    $('#lblChoice2').html(msg.d[2]);
    $('#lblChoice3').html(msg.d[3]);
    $('#lblChoice4').html(msg.d[4]);

如何保留字形？

Answer 1

试试这个:

$('#lblChoice0').html(msg.d[0] + '<i id="0" class="icon-volume-up icon-2x"></i>');
$('#lblChoice1').html(msg.d[1] + '<i id="1" class="icon-volume-up icon-2x"></i>');
$('#lblChoice2').html(msg.d[2] + '<i id="2" class="icon-volume-up icon-2x"></i>');
$('#lblChoice3').html(msg.d[3] + '<i id="3" class="icon-volume-up icon-2x"></i>');
$('#lblChoice4').html(msg.d[4] + '<i id="4" class="icon-volume-up icon-2x"></i>');

或者(这可能更好):

像这样创建你的 HTML:

<a href="#" id="lblChoice0" class="list-group-item"><span id="title_0">zero</span><i id="0" class="icon-volume-up icon-2x"></i></a>

然后在 jQuery 中:

$('#title_0').html(msg.d[0]);

显然对所有 5 行执行相同的操作。