Browser Autoausfüllfunktion tut auslösen irgendwelche Ereignisse JS

Question

<form> 
<input type="text" id="username" value="Username"> 
<div style="position:relative"> 
<span style="position:absolute;top:0;" id="passwordTxt">Password</span> 
<input style="position:absolute;top:0;visibility:visible;" 
type="password" id="password" value=""> 
</div> 
</form> 

var obj=document.getElementById("password") 
obj.addEventListener("change", change(0) , false); 
obj.addEventListener("input", change(0) , false); 
obj.addEventListener("focus", change(0) , false); 
obj.addEventListener("blur", change(1) , false); 

function change(action){ 
return function(){ 
var txt = document.getElementById("passwordTxt") 
var pass= document.getElementById("password") 
if(action){ 
if(pass.value =="") 
txt.style.visibility="visible"; 
} 
else txt.style.visibility="hidden"; 
} 
} 

Die Anwesenheit von type="password" wird der Browser ermöglichen, für die remember password Funktion zu veranlassen. Wenn der Benutzername bereits vorhanden ist, Drop-Down-Pop-up mit zwischengespeicherten Benutzernamen und wenn seine password vorhanden sind - es wird vom Browser aufgefüllt - ziemlich praktisch. aber diese Funktion löst keine JS-Ereignisse aus !!. Ich möchte, dass die span ausgeblendet wird, wenn ein Passwort oder ein beliebiger Wert in diese Passwort-Textbox eingegeben wird, aber die Browser-Funktion lässt einen kleinen Fehler schleichen.

Jede Hilfe sehr geschätzt wird. (Ich arbeite nicht mit jQuery, so eine einfache JS Abhilfe/Lösung, was mir helfen würde, ist)

Answer 1

Ich glaube, Sie wollen das Textfeld mit dem Titel Passwort in den Schatten stellen, wenn es leer ist. Die einfache Lösung, die ich mir vorstellen kann, besteht darin, beim Laden der Seite zu haken und zu sehen, ob der Text verfügbar ist.

Der bessere Ansatz ist die Verwendung bestehender und getesteter Frameworks. Sie können in Bootstrap finden, was Sie suchen. Gehe zu http://twitter.github.com/bootstrap/base-css.html#forms und schaue auf Inline-Formulare Beispiel