オートコンプリートでパスワード入力が完了したときのトリガーイベント

Question

ログイン用のシンプルなフォームがあり、空である限り、フィールドにキャプションを表示したい。問題は、JSでパスワードタイプを変更できないということでした。

パスワードフィールドが空の場合、パスワードフィールドと交換される2番目の入力がありました。

ユーザーがユーザー名を入力し、ブラウザがパスワードフィールドを自動入力すると、パスワードフィールドは表示されません。 どうすればよいですか？

マイHTML、

<form name="login" method="post" action="/login" class="dialog form"> 
    <input type="submit" value="GO" /> 
    <div class="field"> 
     <input type="text" name="username" class="required" title="Username"/> 
    </div> 
    <div class="field"> 
     <input type="password" name="password" class="required" /> 
     <input type="text" value="Password" class="password-title" /> 
    </div> 
    <p class="clear">&nbsp;</p> 
</form> 

私のJS（jQueryのが必要）：ヘルプ

 $("input[type=text]").each(function(){ 
      var input = $(this); 

      if(input.val() == "") input.val(input.attr('title')); 
      input.bind('click', function(){ 
       $(this).focus(); 
       if($(this).val() == $(this).attr('title')) $(this).val(""); 
      }); 
      input.bind('blur', function(){    
       if($(this).val() == "") $(this).val($(this).attr('title')); 
      }); 

     }); 

     $("input[type=password]").each(function(){ 
      var input = $(this); 
      var title = input.next('.password-title'); 

      if(input.val() == "" && title.length > 0){ 
       title.show(); 
       input.hide(); 
      } 

      title.bind('click', function(){ 
       title.hide(); 
       input.show(); 
       input.focus(); 
      }); 

      input.bind('blur', function(){ 
       if($(this).val() == ""){ 
        title.show(); 
        input.hide(); 
       } 
      }); 

      input.bind('DOMAutoComplete', function(){ 
       alert("dafuq"); //does not work (tested in Chromeium) 
      }); 

ありがとう！

Answer 1

入力要素のプレースホルダ属性を代わりに使用することをおすすめします。詳しくはhereをご覧ください。

Answer 2

input.bind('change', function(){ 
    title.hide(); 
    input.show(); 
    input.focus(); 
});