Question

我是js的新程序员，我尝试使用js和html做一个基本的网站。我尝试做像用户名和密码输入框，但它的功能不起作用。有什么问题？

这是代码：

＆＃13;

    function entering() {
    	alert("hi")
    	var username = document.getElementById("fuser");
    	var password = document.getElementById("fpass");
    	if (username == "f") {
    	if (password == "f") {
    	alert('Nice');
    	}else {
    	alert('wrong password');
    	}else{
    	alert('wrong username');}}
    
    	document.getElementById("frm1").submit();
    }

＆＃13;

    <h1>Best Website</h1>
    <h2>Hello!<h2>
    		
    <form id = frm1>
    	Username: <input type = "text" id="fuser"><br>
    	Password: <input type = "text" id="fpass"><br>
    	<input type = "button" onclick = "entering()" value = "submit">
    
    	
    </form>

＆＃13;

Answer 1

您要搜索的是输入元素的value属性。

var username = document.getElementById("fuser");
var password = document.getElementById("fpass");

仅引用页面中的元素，而不是用户输入的内容

var username = document.getElementById("fuser").value;
var password = document.getElementById("fpass").value;

完整代码：

function entering() {
    alert("hi")
    var username = document.getElementById("fuser").value;
    var password = document.getElementById("fpass").value;
    if (username == "f") {
      if (password == "f") {
        alert("correct");
      } else {
        alert("wrong password")
      }
    } else {
      alert("wrong username");
    }

    //document.getElementById("frm1").submit();
}

<h2>Hello!<h2>

<form id = frm1>
    Username: <input type = "text" id="fuser"><br>
    Password: <input type = "text" id="fpass"><br>
    <input type = "button" onclick = "entering()" value = "submit">


</form>

Answer 2

var username = document.getElementById("fuser");
var password = document.getElementById("fpass");

抓取输入元素时，会将元素存储到变量中，而不是值。当你编写if条件时，你需要指向名为value的元素上的属性。

if (username.value == "f") {
if (password.value == "f") {

Answer 3

您需要修改if / else语句，并确保访问您引用的元素的值。

if (username == "f") {
if (password == "f") {
alert('Nice');
}else {
alert('wrong password');
}else{
alert('wrong username');}}

要：

if (username.value == "f") {
    if (password.value == "f") {
        alert('Nice');
    } else {
        alert('wrong password');
    }
} else {
    alert('wrong username');
 }

这会让你再次感动。

＆＃13;

<!DOCTYPE html>
<html>

<head>
    <title>The Best Website</title>
</head>

<body>

    <h1>Best Website</h1>
    <h2>Hello!
        <h2>

            <form id=frm1>
                Username:
                <input type="text" id="fuser">
                <br> Password:
                <input type="text" id="fpass">
                <br>
                <input type="button" onclick="entering()" value="submit">


            </form>

            <script>
                function entering() {
                    alert("hi")
                    var username = document.getElementById("fuser");
                    var password = document.getElementById("fpass");
                    if (username == "f") {
                        if (password == "f") {
                            alert('Nice');
                        } else {
                            alert('wrong password');

                        }
                    } else {
                        alert('wrong username');
                    }

                    document.getElementById("frm1").submit();
                }

            </script>

</body>

＆＃13;

HTML和javascript输入和功能

3 个答案: