使用jquery更新類

Question

在下面的html，jquery，bootstrap代碼中，

addMenuBar : function addNavigation (component) {
    var html = '<ul class="nav nav-pills nav-justified" role="tablist">';
    html += '<li id ="scenario" class="disabled"><a href="#">Scenario</a></li>';
    html += '<li id ="resolutions" class="disabled"><a href="#">Resolutions</a></li>';
    html += '<li id ="triggers" class="disabled"><a href="#">Triggers</a></li>';
    html += '</ul>';
    component.append(html);
    $('ul[id="scenario"] li').addClass("active");
}

組件是一個容器div，如下所示：

    this.container = $(document.createElement('div'));
    this.container.addClass('patient-hover-inner');
    this.container.appendTo(this.form);

我想將id ='scenario'的'li'項的類從'disabled'更改為'active'。 我該怎么做呢？ 以上操作不會沒有任何錯誤

Answer 1

使用switchClass（）

$('li.disabled').switchClass("disabled", "active");

如果你不使用jQuery UI，你可以這樣做

$('li.disabled').each(function(){
    $(this).removeClass('disabled');
    $(this).addClass('active');
});

Answer 2

$('ul[id="scenario"] li').addClass("active");

可

$('ul li#scenario').removeClass("disabled").addClass("active");

如果li有禁用的類，它將被刪除。 如果沒有，則沒有任何反應。 在任何一種情況下，都會添加“有效”類。