Ich schrieb mehrere Funktionen, um zu überprüfen, ob die beiden Passwörter gleich sind. Wenn ich aus dem Feld "Passwort verifizieren" klicke, sollte entweder "Die Passwörter stimmen" oder "Bitte geben Sie Ihr Passwort erneut ein, weil die beiden Passwörter nicht übereinstimmen" angezeigt werden, je nachdem, ob die Passwörter gleich sind oder nicht. Wenn ich jedoch zwei identische oder zwei verschiedene Passwörter eintippe und aus dem Textfeld "Passwort verifizieren" klicke, wird die Nachricht überhaupt nicht angezeigt. Was mache ich hier falsch?Warum werden meine Nachrichten nicht angezeigt, wenn ich aus der Textbox auf meiner Webseite klicke?
Dies ist, was die Aufgabe fragt: Die Webseite sollte zwei Eingabefelder von Typ = "Passwort" haben. Der Benutzer muss ein neues Passwort in das erste Eingabefeld eingeben und dann das Passwort erneut in das zweite Eingabefeld eingeben.
Wenn der Fokus die zweite Box verlässt, überprüft Ihr Skript, ob die Werte beider Boxen gleich und nicht leer sind (5 Punkte). Hinweis: Viele Beispiele im Internet verwenden die HTML-Eigenschaft onchange in der HTML-Datei, um den Ereignishandler aufzurufen. Verwenden Sie keine HTML-Eigenschaft eines beliebigen Typs, um Ereignisse zu verarbeiten. Definieren Sie stattdessen einen Ereignis-Listener in Ihrer JS-Datei (5 Punkte).
Wenn sie nicht übereinstimmen, zeigen Sie eine Meldung an, die besagt, dass ein zweiter Versuch erforderlich ist, und setzen Sie den Fokus im ersten Kennwortfeld zurück. Wenn sie gleich sind, ersetzen Sie alle vorherigen Fehlermeldungen durch eine Meldung, dass die Passwörter übereinstimmen.
Ich verwende eine password.js Datei und eine setpassword.html Datei für diese Webseite.
Meine password.js Datei ist:
var password1 = document.getElementById("txtPassword").value;
var verifypassword = document.getElementById("txtPWVerified").value;
var verifypasswordclick = document.getElementById("txtPWVerified");
function verifypassword1() {
if(password1 == verifypassword && password1 != "" && verifypasword != "") {
alert('The passwords match');
}
else if(password1 != verifypassword || password1 == "" || verifypasword == "") {
alert("Please enter your password again because the two passwords don't match");
}
}
verifypasswordclick.onblur = function() {
verifypassword1;
};
Meine setpassword.html Datei ist:
<!DOCTYPE html>
<!-- H5FormValidation.html -->
<html lang="en">
<head>
<meta charset="utf-8">
<title>Register Here</title>
</head>
<body>
<h2>Register Here</h2>
<form id="formTest" method="get" action="processData">
<table>
<tr>
<td><label for="txtEmail">Email<span class="required">*</span></label></td>
<td><input type="email" id="txtEmail" name="email" required></td>
</tr>
<tr>
<td><label for="txtPassword">Password<span class="required">*</span></label></td>
<td><input type="password" id="txtPassword" name="password" required></td>
</tr>
<tr>
<td><label for="txtPWVerified">Verify Password<span class="required">*</span></label></td>
<td><input type="password" id="txtPWVerified" name="pwVerified" required></td>
</tr>
<tr>
<td> </td>
<td>
<input type="reset" value="CLEAR" id="btnReset"></td>
</tr>
</table>
</form>
<script src = "password.js"></script>
</body>
</html>
Wenn ich meine "verifypassword1;" ersetzen phrase unter dem Parameter verifypasswordclick.onblur = function() {Ausdruck mit Ihrem Vorschlag (der "verifypasswordclick.addEventListener (" blur ", verifypassword1);") ist, wird trotzdem keine Nachricht angezeigt. –
@MichaelBao Sie müssen Klammern() nach verifypassword1 hinzufügen, andernfalls wird es während der Ausführung des 'onblur' Handlers nicht aufgerufen. –
Ich sage diese Zeile anstelle von 'verifypasswordclick.onblur = function() {verifypassword1;};' zu verwenden, aber wenn du es so einstellen willst, musst du Klammern verwenden wie 'verifezypasswordclick.onblur = function() {verifezypassword1();}; ' – kamoroso94