jquery keyup 事件不会触发 add/removeClass答案

【问题标题】：jquery keyup event wont trigger add/removeClassjquery keyup 事件不会触发 add/removeClass
【发布时间】：2014-08-13 07:01:22
【问题描述】：

我有一个用于过滤数据表的常规输入字段。我在触发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 触发器对每个字符都正确，但输入不正确。只有当我在文本输入之外单击时，颜色才会改变。

我做错了什么？

【问题讨论】：

看起来不错jsfiddle.net/arunpjohny/7o03dfpe/1
这很奇怪，它不适用于我的项目......
你确定你正确加载了 jQuery 吗？任何其他代码覆盖任何input 元素？等等等等。
尝试在 if-else 块之后调用 fnFilter。可能是它正在返回一些东西
我仔细查看了我的 bootstrap.css，但找不到任何会覆盖输入的代码。

标签： javascript jquery css

【解决方案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');
    }
});

【讨论】：