Заполнитель в IE9

Question

Кажется, это очень известная проблема, но все решения, которые я нашел в Google, не работают на моем недавно загруженном IE9.

Какой ваш любимый способ включить свойство Placeholder для тегов input и textarea?

Необязательно: я потерял много времени на это и пока не искал свойство required. У вас также есть совет для этого? Очевидно, что я могу проверить значение в PHP, но помочь пользователю это свойство очень удобно.

Answer 1

Я обычно довольно высоко оцениваю http://cdnjs.com/, и они перечисляют:

// cdnjs.cloudflare.com/ajax/libs/placeholder-shiv/0.2/placeholder-shiv.js

Не уверен, что это за код, но это выглядит просто:

document.observe('dom:loaded', function(){
  var _test = document.createElement('input');
  if( ! ('placeholder' in _test) ){
    //we are in the presence of a less-capable browser
    $$('*[placeholder]').each(function(elm){
      if($F(elm) == ''){
        var originalColor = elm.getStyle('color');
        var hint = elm.readAttribute('placeholder');
        elm.setStyle('color:gray').setValue(hint);
        elm.observe('focus',function(evt){
          if($F(this) == hint){
            this.clear().setStyle({color: originalColor});
          }
        });
        elm.observe('blur', function(evt){
          if($F(this) == ''){
            this.setValue(hint).setStyle('color:gray');
          }
        });
      }
    }).first().up('form').observe('submit', function(evt){
      evt.stop();
      this.select('*[placeholder]').each(function(elm){
        if($F(elm) == elm.readAttribute('placeholder')) elm.clear();
      });
      this.submit();
    });
  }
});