javascript - 在JS中操作时CSS类“加倍”

我正在尝试向表中的可排序列添加箭头。

第一次运行良好，然后使类加倍。

headerUnSort-> headerSortDown-> headerSortUp-> headerUnSort headerSortDown

有人知道为什么会这样吗？ （由于某些原因，我还必须删除“ header”类。）

$(this).removeClass('header');

if (this.className == 'headerUnSort')
{
    $(this).removeClass();
    this.className = 'headerSortDown';
}
else if (this.className == 'headerSortDown')
{
    $(this).removeClass();
    this.className = 'headerSortUp';
}
else if (this.className == 'headerSortUp')
{
    $(this).removeClass();
    this.className = 'headerUnSort';
}

最佳答案

没有更多的上下文很难说，但是我不认为代码确实在按照您的想法做。尝试这个：

var $this = $(this);
$this.removeClass('header');

if ($this.hasClass('headerUnSort')) {
    $this.removeClass('headerUnSort');
    $this.addClass('headerSortDown');

} else if ($this.hasClass('headerSortDown')) {
    $this.removeClass('headerSortDown');
    $this.addClass('headerSortUp');

} else if ($this.hasClass('headerSortUp')) {
    $this.removeClass('headerSortUp');
    $this.addClass('headerUnSort');
}

或者，这应该快得多：

var $this = $(this);
$this.removeClass('header');

if ($this.hasClass('headerUnSort')) {
    this.className = 'headerSortDown';

} else if ($this.hasClass('headerSortDown')) {
    this.className = 'headerSortUp';

} else if ($this.hasClass('headerSortUp')) {
    this.className = 'headerUnSort';
}

关于javascript - 在JS中操作时CSS类“加倍”，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/31128582/