Форма логина JavaScript document.getElementById не определяет значение - PullRequest
0 голосов
/ 01 сентября 2018

Может кто-нибудь сказать мне, почему document.getElementById не обнаруживает введенный пароль в коде ниже:

function myFunction() {

  let email = "name@email.com";
  let password = "password";

  if (document.getElementById("password") == password) {
    Console.console.log("success");
  } else {
    console.log("Failure");
    console.log(password);
    console.log(document.getElementById("password"));
  }

}
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Login</title>
</head>
<body>

  <form action="#">
    <label for="Email">Email</label>
    <input id="email" type="email">
    <label for="password">Password</label>
    <input id="password" type="text">
    <button onclick="myFunction()">Submit</button>
  </form>

</body>
</html>

Когда я пытаюсь зарегистрировать его значение в консоли, я просто получаю input id = "password" type = "text", и я не уверен, что это означает, за исключением того, что по какой-то причине у него нет значения, которое я хочу присвоить это.

-Спасибо

Ответы [ 3 ]

0 голосов
/ 01 сентября 2018

Изменить эти строки

   if(document.getElementById("password") == password){
   console.log(document.getElementById("password"));

на эти строки

   if(document.getElementById("password").value == password){
   console.log(document.getElementById("password").value);

и Боб твой дядя.

0 голосов
/ 01 сентября 2018

ваша реализация в порядке, но вы допустили небольшую ошибку. Документ возвращает объект с несколькими ключами. Среди этих ключей «значение» ключ содержит значение вашего поля ввода.

document.getElementById("password").value

вернет желаемое значение.

Примечание. Вы можете получить доступ ко всем атрибутам этого объекта. Например

document.getElementById("password").placeholder 

вернет подсказку из поля ввода

0 голосов
/ 01 сентября 2018

Функция document.getElementById возвращает объект элемента DOM. Этот объект имеет различные атрибуты, такие как .style, но для получения текста, введенного для элемента <input>, требуется атрибут .value.

function myFunction() {
    let email = "name@email.com";
    let password = "password";

    if (document.getElementById("password").value == password){
        console.log("success");
    } else {
        console.log("Failure");
        console.log(password);
        console.log(document.getElementById("password").value);
    }
}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Login</title>
</head>
<body>
    <form action="#">
        <label for="Email">Email</label>
        <input id="email" type="email">
        <label for="password">Password</label>
        <input id="password" type="text">
        <button onclick="myFunction()">Submit</button>
    </form>

</body>
</html>
...