专注于文本字段，背景不改变颜色

Question

嗨，这可能是一个愚蠢的问题，但是当我单击文本字段时，我想让背景改变颜色，但是我不明白为什么它不起作用

谁能告诉我我要去哪里错了

代码在下面

//JQUERY
$(function() {

    $('input[type="text"]').focus(function() 
    {
        $(this).addClass("focus");
    });

    $('input[type="text"]').blur(function() 
    {
        $(this).removeClass("focus");
    });

})

;

//CSS
.focus {
    border: 2px solid #AA88FF;
    background-color: #FFEEAA;
}

HTML //当我也检查它们时，所有type text字段均为type text

Answer 1

您可以在CSS中完成此操作，而无需jQuery（至少对于较新的主流浏览器而言）

input[type="text"]:focus
{
   border: 2px solid #AA88FF;
   background-color: #FFEEAA;
}

:)

Answer 2

好像是jquery库的怪癖。 尝试：

$(this).css({...})

代替：

$(this).addClass(...)

它应该工作。

Answer 3

我不确定您为什么在这里使用jQuery，使用CSS更改背景颜色完全有可能。

    input[type=text]:focus {
        border: 2px solid #AA88FF;
        background-color: #FFEEAA;
    }