matsukaz's blog

Agile, node.js, ruby, AWS, cocos2d-xなどなどいろいろやってます

入力位置の背景色を変える


こんな感じで入力位置の背景色を変える方法。
HTMLはこんな感じ。

<form>
<input type="text" name="hoge1"><br/>
<textarea name="hoge2"</textarea>
</form>

例によって色はCSSで。

.focus { background-color: #ffffcc; }

んでJavascriptをこんなん。

$(document).ready(function(){
  $("input,textarea").focus(function(){
    $(this).addClass("focus");
  }).blur(function(){
    $(this).removeClass("focus");
  });
});

$(セレクター).focus(fn).blur(fn);って感じでイベントをつなげて書いてるとこがポイントかな。こういう書き方ができるとコードもすっきりして良い感じ。