ブートストラップCSSのトップバー入力の問題

Question

ブートストラップCSSを使用してトップバーに入力ボックスを作成すると、プレースホルダの値はIE以外のすべてのブラウザで表示されます。しかし、Twitterのサイトでは何とか見えるようにしています（javascriptではなく、スクリプトを無効にしてテストしたためです）。そこにいる誰も私を助けることができますか？

Answer 1

コードを見るのが得意ですが、入力タグにplaceholder = "my placeholder"属性を設定すると仮定します。これは新しいHTML5の機能性です。そのため、JavaScriptなしで動作しています。

なぜそれが機能していないのか、私が考えることができるいくつかの理由があります。

1. doctypeをhtml5に正しく設定します。
2. 空の行でなく、doctype宣言の前には何もないことを確認してください。
3. CSSスタイルを正しく設定してください。あなたはそれが比較的新しい機能ですので、ベンダーが を接頭辞を使用する必要があります：

---

::-webkit-input-placeholder { color:#999; }; 
:-moz-placeholder { color:#999; }; 
:-ms-input-placeholder { color:#999; }; 
:placeholder { color:#999; }; 
.placeholder { color:#999; }; 

Answer 2

は、私は同様の問題が発生すると、これを行うことにより、IEで同じプレースホルダ機能を偽造されました。

<script type="text/javascript"> 
$(function() { 
    if(!$.support.placeholder) { 
     var active = document.activeElement; 
     $(':text').focus(function() { 
      if ($(this).attr('placeholder') != '' && $(this).val() == $(this).attr('placeholder')) { 
       $(this).val('').removeClass('hasPlaceholder'); 
      } 
     }).blur(function() { 
      if ($(this).attr('placeholder') != '' && ($(this).val() == '' || $(this).val() == $(this).attr('placeholder'))) { 
       $(this).val($(this).attr('placeholder')).addClass('hasPlaceholder'); 
      } 
     }); 
     $(':text').blur(); 
     $(active).focus(); 
     $('form').submit(function() { 
      $(this).find('.hasPlaceholder').each(function() { $(this).val(''); }); 
     }); 
    } 
}); 
</script> 

出典：http://www.cssnewbie.com/cross-browser-support-for-html5-placeholder-text-in-forms/