javascript - jquery keyup 事件不会触发添加/删除类

Question

我有一个用于过滤数据表的常规输入字段。我在触发 fnFilter 的输入上有一个 keyup 函数，我还想更改输入的颜色以通知用户过滤器处于事件状态。

这是我的代码:

CSS

.pn-input {
        border-color:#4d4f53;
}

.pn-input-active {
        border-color:#126C00;
}

jQuery

$('#searchfield').keyup(function () {
    oTable.fnFilter($(this).val());

    if ($(this).val().length > 0) {
        $(this).removeClass('pn-input');
        $(this).addClass('pn-input-active');
    } else {
        $(this).removeClass('pn-input-active');
        $(this).addClass('pn-input');
    }
});

fnFilter 触发器对每个字符都是正确的，但输入不是。只有当我在文本输入之外单击时，颜色才会改变。

我做错了什么？

Answer 1

将css改成

.pn-input {
  border-color:#4d4f53!important;
}

.pn-input.pn-input-active {
  border-color:#126C00!important;
}

脚本进入

$('#searchfield').keyup(function () {
    var Self=$(this);
    oTable.fnFilter($(this).val());

    if ($(Self).val().length > 0) {
      $(Self).addClass('pn-input-active');
    } else {
      $(Self).removeClass('pn-input-active');
    }
});