javascript - 重点：始终高于类

Question

我有一个类，我有一些验证（不允许非数字（不在这里，但我在keypress方法上捕获它））。但是，如果我有一个类focus:，它总是在 css 的顶层，我不能暂时覆盖设置。有没有办法解决这个问题？

在这个

JSFiddle

我希望红色边框会在第一个上立即出现keypress，但是它会被焦点覆盖，并且仅在我聚焦时才会出现。

Answer 1

您可以像这样修改类：

.a {
    border:1px solid red !important;
}

!important将覆盖focuscss。

演示：小提琴

Answer 2

改变你的 CSS | 演示

.a{
    border:1px solid red !important;
}

和脚本，如果你想在用户不在输入框焦点的情况下删除红色边框

   $('input').on("keypress", function(){
    $(this).addClass('a');

    });
    $('input').on("blur", function(){
    $(this).removeClass('a');

    })

Answer 3

您是否尝试添加 !important 语句？尝试这样的事情：

input:focus{
    border:1px dashed yellow;
}

在 JS 上，您可以执行以下操作：

$(input).keypress(function(ev){
    var target = ev.target;
    $(target).css({
        borderColor: '#AA0000 !important'
    });
}