使用javascript登录界面

我正在尝试使用javascript创建有效的登录界面。我放下了代码,但它不起作用,并且不显示任何类型的错误消息。 谢谢 塔里斯

function loginFunction() {
  var x = document.getElementById("myText");
  var y = document.getElementById("myText1");
  console.log(x);
  console.log(y);

  if (x == "Tom" && y == "Halo") {
    window.open("www.youtube.de");
  }
}

const button = document.getElementById("button");
button.addEventListener('click', () => {
  loginFunction();
});
<input type="username" id="myText" value="Tom">
<input type="password" id="myText1" value="Halo">
<button id="button">login</button>
评论
  • jdolor
    jdolor 回复

    You need to access the .value of the elements x and y - you're dealing with the element, not the value:

    if (x.value == "Tom" && y.value == "Halo") { ... }
    
  • 犯小贱~
    犯小贱~ 回复

    问题在于您正在读取这些输入元素的值。您已经将输入本身分配给了变量。

     var x = document.getElementById("myText").value;
    
    function loginFunction() {
      var x = document.getElementById("myText").value;
      var y = document.getElementById("myText1").value;
      console.log(x);
      console.log(y);
    
      if (x === "Tom" && y === "Halo") {
        alert('open page')
        //window.open("https://youtube.de");
      }
    }
    
    const button = document.getElementById("button");
    button.addEventListener('click', () => {
      loginFunction();
    });
    <!DOCTYPE html>
    <html lang="en">
    
    <head>
      <meta charset="UTF-8">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <title>Document</title>
    </head>
    
    <body>
      <input type="username" id="myText" value="Tom">
      <input type="password" id="myText1" value="Halo">
      <button id="button">login</button>
    </body>
    
    </html>
  • Oo暧昧
    Oo暧昧 回复

    您忘记将.value添加到选定的文本字段。

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Document</title>
    </head>
    <body>
        <input type="username" id="myText" value="Tom">
        <input type="password" id="myText1" value="Halo">
        <button id="button">login</button>
        <script>
    
    
    function loginFunction () {
        var x = document.getElementById("myText").value;
        var y = document.getElementById("myText1").value;
            console.log(x);
            console.log(y);
    
        if(x === "Tom" && y === "Halo") {
            console.log("login in");
            //window.open("www.youtube.de");
        }
        else
        {
          console.log("failed");
        }
    }
    
    const button = document.getElementById("button");
    button.addEventListener('click', () => {
        loginFunction();
    });
    
        </script>
    </body>
    </html>