javascript - 一个简单的 JS+HTML 脚本不适合我

Question

我有以下代码:

<div style="text-align: center;margin: auto;display: block;padding: 20px;width: 200px;">
        <button onclick="usernamePrompt()">Click to enter the username</button>
        <button onclick="passwordPrompt()">Click to enter the password</button>
        <button onclick="verify()">Verify here</button>
    </div>
    <div style="text-align: center;margin: auto;display: block;padding: 20px;">
        <p style="text-align: center;font-size: 20px;" id="verifyPara"></p>
    </div>
    <script type="text/javascript">
        function usernamePrompt () {
            window.username = prompt('Enter username:');
        };
        function passwordPrompt () {
            window.password = prompt('Enter password:');
        };
        function verify (username,password) {
            if (username === "immoral" && password ==="koala") {
                document.getElementById('verifyPara').innerHTML='Success!';
            } else {
                document.getElementById('verifyPara').innerHTML='Fail!';
                delete username;
                delete password;
            };
        }
    </script>

当然，当我尝试此代码时，我会在两个“提示符”中提交数据。我在 if-else 语句中使用此数据，如果提交的用户名和密码是所需的，那么它应该产生“成功”，否则它应该产生“失败”。
问题是它永远不会产生“成功”，而总是“失败”。代码有什么问题？请帮忙。谢谢

Answer 1

首先我要说的是，您不能将密码作为带有 javascript 提示的文本字段。好吧，对于您的解决方案，您可以设置两个隐藏字段——一个用于用户名，另一个用于密码。提示后设置值。比较时，从隐藏值开始比较。我再说一遍，这不是现实生活中的做法。您可以查看它以更好地理解 javascript 的工作原理。
请看下面的代码:

<div style="text-align: center;margin: auto;display: block;padding: 20px;width: 200px;">
        <button onclick="usernamePrompt()">Click to enter the username</button>
        <button onclick="passwordPrompt()">Click to enter the password</button>
        <button onclick="verify()">Verify here</button>
    </div>
    <div style="text-align: center;margin: auto;display: block;padding: 20px;">
        <p style="text-align: center;font-size: 20px;" id="verifyPara"></p>
    </div>
    <input type="hidden" id="userName"/>
    <input type="hidden" id="password"/>
    <script type="text/javascript">

        function usernamePrompt () {
            var username = prompt('Enter username:');
            document.getElementById('userName').value= username;
        };
        function passwordPrompt () {
            var password = prompt('Enter password:');
            document.getElementById('password').value = password;
        };
        function verify ( ) {
            if (document.getElementById('userName').value == "immoral" && document.getElementById('password').value =="koala") {
                document.getElementById('verifyPara').innerHTML='Success!';
            } else {
                document.getElementById('verifyPara').innerHTML='Fail!';


            };
        }
    </script>