javascript - 入力フィールドのデフォルト値「password」、表示しますか?

Question

このjsを使用してデフォルトのパスワードを表示しています。ユーザーがクリックするとデフォルト値が自動的にクリアされ、ユーザーが何も入力せずに選択を解除すると、デフォルト値が再表示されます。

私はすべてのフィールドでそれを使用しましたが、明らかにパスワードの場合はよりトリッキーです! :)

どのようにしますか？

<input
    type="password"
    onblur="this.value=!this.value?'Password':this.value;"
    onfocus="this.select()"
    onclick="if (this.value=='Password'){this.value='';}"
    name="pwd"
    id="user_pass"
    class="input"
    value="Password"
    size="20"
    tabindex="20" />

Answer 1

あなたは考えていました<input placeholder='Password' type='password'/>か？

Answer 2

これがあなたの解決策です: http://jsfiddle.net/cgP5K/1/

<input
  type="text"
  onblur="this.value=!this.value?'Password':this.value;"
  onfocus="this.select()"
  onclick="if (this.value=='Password'){this.value=''; this.type='password'}"
  name="pwd"
  id="user_pass"
  class="input"
  value="Password"
  size="20"
  tabindex="20" />​

Answer 3

プレースホルダーとしてプレーン テキスト入力を作成する必要があります。このコードは、変数をグローバル スコープに公開せずにそれを行います。

​<input id="pass-placeholder" type="text"​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​ value="Password" />
<script type="text/javascript">
(function(){
    var pass_holder_el = document.getElementById('pass-placeholder');
    var pass_el = document.createElement('input');
    pass_el.type = 'password';

    pass_el.onblur = function(){
        if(!this.value)
            this.parentNode.replaceChild(pass_holder_el, this);
    }

    pass_holder_el.onfocus = function(){
        this.parentNode.replaceChild(pass_el, this);
        pass_el.focus();    
    }
})();
</script>​

JSFiddle

Answer 4

以下の解決策を使用してください。

<input name="password" class="input"value="Password" size="20"
  tabindex="20"  onclick="if(this.value==defaultValue){this.value=''; this.type='password'} else if(this.value==''){this.value=defaultValue; this.type='text'} " onblur="if(this.value==''){this.value=defaultValue; this.type='text'}"/>

最初の解決策はうまく機能しますが、パスワードフィールドを空にすると、テキストであるデフォルト値に変換されないためです。したがって、上記の解決策を試してください。

Answer 5

これを試してみてください - http://roshanbh.com.np/examples/text-in-password/