IE9 以下でもプレースホルダー的動きのできる入力フォームを作る

最近のブラウザはフォームの入力値にプレースホルダー機能があって、
ラベルを別に作らなくても入力してほしい値を表示させることが出来る。
スペースの苦しい場合などに重宝するが、IE9以下にはその機能がないため、
疑似的にプレースホルダーを実現する仕組みをネットでいろいろ調べてみた。

http://jsfiddle.net/XB5WW/light/

//IE9以下の場合はplaceholderの値をvalueに変換
if(ie() <= 9) {
  var searchText = $("#s").attr("placeholder");
  $("#s").val(searchText);
  $("#s").css("color", "#999");
  $("#s").focus(function() {
    if($(this).val() == searchText) {
      $(this).val("");
      $(this).css("color", "#000");
    }
  }).blur(function() {
    if($(this).val() == "") {
      $(this).val(searchText);
      $("#s").css("color", "#999");
    }
  });
}

//IE使用バージョン取得
function ie() {
  var undef, v = 3, div = document.createElement('div');
  while (
    div.innerHTML = '',
    div.getElementsByTagName('i')[0]
  );
  return v> 4 ? v : undef;
}

もう寝る

おやすみなさい

最初の投稿

highroller　

初投稿




ページ