"Passwort anzeigen"-Button auf Login-Seite

[StarterKid]

Auf der Login-Seite wird das Passwort als Sternchen dargestellt. Wenn man sich vertippt, muss man es komplett neu eingeben.

Einige Webseiten haben einen "Anzeige"-Button, mit dem sich das Passwort anzeigen lässt.
Leider habe ich keine entsprechende Extension gefunden. Habt ihr Ideen?

[LukeWCS]

Hallo

Für den Zweck ist mir keine bekannt.

Ist die Frage für dich persönlich oder für deine Benutzer? Falls ersteres: wohl für die meisten Browser gibt es Plugins um das zu erreichen. Dann hast du das Feature nicht nur bei phpBB, sondern auch bei allen anderen Seiten.

[StarterKid]

Ich persönlich brauche das nicht. Aber ich habe einen User, der quasi nur mit dem Handy und zittrigen Fingern arbeiten kann (Krankheit). Da ist die Neueingabe eines einzigen falschen Zeichens einfacher als alles neu eingeben zu müssen.
Außerdem ist er sehr datenschutzbedacht und speichert keine Passwörter und will auch keine Erweiterungen in seinem Browser installieren.
Mir liegt sehr viel an ihm. Daher möchte ich ihm eine solche Funktion gern zur Verfügung stellen

[chris1278]

Das sollte per JavaScript gehen. Mann müsste mit JavaScript auf den type des Input Feldes eingehen und diesen zu Text ändern.

Allerdings kenn ich mich mit Java nicht aus.

Bei Google findet man schon einige Skripte und Beispiele vielleicht hilft dir da etwas.

[IMC]

Das hatte ich schon länger mal vor zu machen. Dies hier auf die schnelle:

Code: Alles auswählen

<script>
	var imcgerPwInput = document.getElementById("password");
	var imcgerPwToggel = '<button type="button" class="button" onclick="imcgerToggelPw(this)"><i class="icon fa-eye fa-fw" aria-hidden="true"></i></button>';

	if (imcgerPwInput) {
		imcgerPwInput.insertAdjacentHTML("afterend", imcgerPwToggel);
	}

	function imcgerToggelPw(button) {
		buttonIcon = button.children[0];
		
		if (imcgerPwInput.type == "password") {
			imcgerPwInput.type = "text";
			buttonIcon.className  = "icon fa-eye-slash fa-fw";
		} else {
			imcgerPwInput.type = "password";
			buttonIcon.className  = "icon fa-eye fa-fw";
		}
	}
</script>

Dies Skript müsstest du in die overall_footer.html deines Styles eintragen. Nach dem Text {$SCRIPTS}.

Code: Alles auswählen

<!-- IF S_PLUPLOAD --><!-- INCLUDE plupload.html --><!-- ENDIF -->
{$SCRIPTS}

<!-- EVENT overall_footer_body_after -->

</body>

Edit: Wenn du noch etwas Zeit hast könnte ich es auch in eine Extension verpacken. Das wäre wohl die einfachste Lösung für dich.

[chris1278]

Also ich habs mal getestet und kann zumindest bestätigen das dieses skript so funktioniert.

@imc

Wenn du willst kann ich dir das als Extension schreiben. Ist ja net sehr viel.

[IMC]

Hi Christian,

kannst du gerne tun.
Der Button muss noch eine ID bekommen damit man den Style anpassen kann.
padding würde ich dann erst einmal auf 0px setzen. Das sieht zumindest für mich bei Prosilver etwas besser aus.

[chris1278]

Ok. Alles klar. Schick dir das dann per pn.

[IMC]

Wenn du dir die Arbeit machst kannst die auch gern bei dir veröffentlichen.

[chris1278]

Na ich hab das jetzt schon fertig unter deinem Nick. Kein Problem. Kriegste gleich.

@edit

So hab dir das als pn geschickt.