jquery - jqueryフォーカス、フォーカスを外すと元のcssに戻る

Question

jQueryにこのスクリプトがあります：

<script>
$('#searchbar').focus(function(){
    $(this).parent().css('background-color', 'red');
});
</script>

親に子をフォーカスすると、親の背景が赤くなります。しかし、フォーカスを離れると、まだ赤です。子供の焦点を外したときに、別の色、たとえば青に変更するにはどうすればよいですか?

子供は形です。

Answer 1

フォーカスアウト機能を追加

$('#searchbar').focus(function(){
    $(this).parent().css('background-color', 'red');
}).blur(function() {
    //do what you need
    $(this).parent().css('background-color', 'blue');
});

Answer 2

blur()を使用できます:

$('#searchbar').blur(function() {
    $(this).parent().css('background-color', 'black');
});