javascript CSS 或 JS - 当输入聚焦时更改输入的背景颜色？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/20199017/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
CSS or JS - change background color of input when input is focused out?
提问by itsme
Is there any way to set a background-coloron input text when it looses focus?
background-color当输入文本失去焦点时，有什么方法可以设置它吗？
I'm trying in js but i would like to know if it's possible in css pure.
我正在尝试使用 js，但我想知道是否可以使用纯 css。
this seems not working
这似乎不起作用
input{
background-color:#fff !important;
}
input:focus{
background-color:#333 !important;
}
//input:unfocused and has value{ ??? :) }
$('input,textarea').on('focusout',function(e){
if($(this).val().length){
$(this).css('background-color','#fff');
}
});
thank you
谢谢
采纳答案by SW4
The CSS3 method would be, for example:
例如，CSS3 方法是：
input[type=text]:focus{
color:red;
}
See THIS FIDDLE. Its a bit backward, you'd style the active, not the blurred selector.
看到这个小提琴。它有点落后，您可以设置活动的样式，而不是模糊的选择器。
To simulate blur, you can use :not(:focus), see here
要模拟模糊，您可以使用:not(:focus)，请参见此处
回答by Joao Paulo
textarea and input are different selectors:
textarea 和 input 是不同的选择器：
Do this with jquery:
使用 jquery 执行此操作：
<script type="text/javascript">
$(document).ready(function(){
$('textarea').on('focusout',function(){ // When losing focus
$(this).css('background','#FFF');
});
$('textarea').on('focus',function(){ // When focus
$(this).css('background','#333');
});
});
</script>
Or CSS:
或 CSS：
textarea { background-color:#fff !important; }
textarea:focus { background-color:#333 !important; }
