Подтверждение соответствия пароля

Я пытаюсь создать форму, которая проверяет, совпадают ли мои пин и pswd с формой. Но не уверен, что мне не хватает. Я немного молод для мира WebDev, и я потратил глупое количество времени, пытаясь понять что-то, что должно быть действительно простым (в моей голове). Я пробовал это 5 разными способами и продолжаю ошарашивать. Вот то, что я по сути скопировал с кого-то другого, и это не работает для меня. Какие-нибудь советы? Просто нужно получить два входа, чтобы проверить, действительно ли они совпадают. К вашему сведению: мой файл, над которым я работаю, называется initialsetup3SANDBOX.php (не уверен, имеет ли это значение).

function myFunction() {
  var pass1 = document.getElementById("pass1").value;
  var pass2 = document.getElementById("pass2").value;
  if (pass1 != pass2) {
    //alert("Passwords Do not match");
    document.getElementById("pass1").style.borderColor = "#E34234";
    document.getElementById("pass2").style.borderColor = "#E34234";
  } else if {
    alert("Passwords Match!!!");
    document.getElementById("regForm").submit();
  }
}
<!DOCTYPE html>
<html>

<head>
</head>

<body>

  <form id="regform" action="/initialsetup3SANDBOX.php" method="post" onsubmit="return myFunction();">
    <input id="pass1" type="password" placeholder="Password" style="border-radius:7px; border:2px solid #dadada;"><br>
    <input id="pass2" type="password" placeholder="Confirm Password" style="border-radius:7px; border:2px solid #dadada;"><br>
  </form>
  <input type="submit" value="Submit">



</body>

</html>

1 ответ

3 вещи

  • <input type="submit" value="Submit" /> следует заключить в тег формы, тогда будет отправлена ​​только форма.

  • Вы должны использовать else не else if,

  • Кроме того, вы должны return false, когда пароль не совпадает. в противном случае действие формы произойдет в любом случае.

function myFunction() {
  var pass1 = document.getElementById("pass1").value;
  var pass2 = document.getElementById("pass2").value;
  if (pass1 != pass2) {
    //alert("Passwords Do not match");
    document.getElementById("pass1").style.borderColor = "#E34234";
    document.getElementById("pass2").style.borderColor = "#E34234";
    return false;
  } else {
    alert("Passwords Match!!!");
    document.getElementById("regForm").submit();
  }
}
<!DOCTYPE html>
<html>

<head>
</head>

<body>
  <form id="regform" action="/initialsetup3SANDBOX.php" method="post" onsubmit="return myFunction();">
    <input id="pass1" type="password" placeholder="Password" style="border-radius:7px; border:2px solid #dadada;"><br>
    <input id="pass2" type="password" placeholder="Confirm Password" style="border-radius:7px; border:2px solid #dadada;"><br>
    <input type="submit" value="Submit" />
  </form>
</body>

</html>

Другие вопросы по тегам