Question

当输入文本失去焦点时，有没有办法在输入文本上设置background-color？

我正在尝试使用js，但我想知道它是否可以在css pure。

这似乎无法正常工作

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

谢谢

Answer 1

CSS3方法将是，例如：

input[type=text]:focus{
    color:red;
}

见THIS FIDDLE。它有点落后，你可以选择活动的，而不是模糊的选择器。

要模拟模糊，您可以使用:not(:focus)，see here

Answer 2

textarea和输入是不同的选择器：

使用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>

或CSS：

textarea { background-color:#fff !important; }  
textarea:focus { background-color:#333 !important; }

CSS或JS - 当输入被聚焦时改变输入的背景颜色？

2 个答案: