Question

我有一个常规输入字段，用于过滤DataTable。我在触发fnFilter的输入上有一个键盘功能，我还想更改输入的颜色以通知用户过滤器处于活动状态。

这是我的代码：

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');
    }
});

jquery keyup事件不会触发add / removeClass

1 个答案: