javascript - 根据状态更改 Bootstrap 字形

Question

我试图根据 StatusLineId 更改我的字形图标，但没有出现任何字形图标。我做错了什么？

HTML 代码:

<div>
    <div id="status-icon" data-bind="visible: statusIcon" style="float:left;width:30px;">
        <span class="glyphicon"></span>
    </div>
</div>

Js函数

function statusIcon() {
    if (StatusLineId == 1) {
        $("#status-icon").find(".glyphicon").addClass("glyphicon-remove");
    }
    else if (StatusLineId == 11) {
        $("#status-icon").find(".glyphicon").addClass("glyphicon-chevron-up");
    }
    else {
        $("#status-icon").find(".glyphicon").addClass("glyphicon-flash"); 
    }
}

Answer 1

我尝试了下面的代码并且成功了。只需更改“StatusLineId” fiddle 的值(value)和测试。

<div>
    <div id="status-icon" data-bind="visible: statusIcon" style="float:left;width:30px;" onClick="statusIcon();">here
        <span class="glyphicon"></span>
    </div>
 </div>


    $( document ).ready(function() {
 var StatusLineId = 0
    if (StatusLineId == 1) {
    //alert('remove');
        $("#status-icon span").toggleClass('glyphicon-arrow-right').toggleClass('glyphicon-remove')
}
    else if (StatusLineId == 11) {
        $("#status-icon span").toggleClass('glyphicon-arrow-right').toggleClass('glyphicon-chevron-up')
}
    else {
        $("#status-icon span").toggleClass('glyphicon-arrow-right').toggleClass('glyphicon-flash');

}

});

https://jsfiddle.net/tsscrpn6/