为什么“确认密码”和“确认密码”相同的部分不起作用？

Question

为什么“ 确认密码和密码相同 ”部分不起作用？ 意思是，使用“ getElementById ”来获取密码和确认密码的部分。 每个部分都起作用，但特定部分起作用。 它在文本字段周围没有显示红色框。 谁能帮我？

<html>
    <head>
    </head>
    <script>
    function submitinfo()
    {
    var firstname = document.getElementById("firstname").value;
    var lastname = document.getElementById("lastname").value;
    var username = document.getElementById("username").value;
    var password = document.getElementById("password").value;
    var confirmpassword = document.getElementById("confirmpassword").value;
    var email = document.getElementById("email").value;

    if(firstname !== "" && document.getElementById("firstname").style.borderColor == "red")
        {
        document.getElementById("firstname").style.border = "none"
        }

    if(lastname !== "" && document.getElementById("lastname").style.borderColor == "red")
        {
        document.getElementById("lastname").style.border = "none"
        }

    if(username !== "" && document.getElementById("username").style.borderColor == "red")
        {
        document.getElementById("username").style.border = "none"
        }

    if(password !== "" && document.getElementById("password").style.borderColor == "red")
        {
        document.getElementById("password").style.border = "none"
        }

    if(confirmpassword !== "" && document.getElementById("confirmpassword").style.borderColor == "red")
        {
        document.getElementById("confirmpassword").style.border = "none"
        }

    if(email !== "" && document.getElementById("email").style.borderColor == "red")
        {
        document.getElementById("email").style.border = "none"
        }

    if(firstname == "")
        {
        document.getElementById("firstname").style.borderColor = "red";
        document.getElementById("firstname").style.borderStyle = "solid";
        }

    if(lastname == "")
        {
        document.getElementById("lastname").style.borderColor = "red";
        document.getElementById("lastname").style.borderStyle = "solid";
        }

    if(username == "")
        {
        document.getElementById("username").style.borderColor = "red";
        document.getElementById("username").style.borderStyle = "solid";
        }

    if(password == "")
        {
        document.getElementById("password").style.borderColor = "red";
        document.getElementById("password").style.borderStyle = "solid";
        }

    if(confirmpassword == "")
        {
        document.getElementById("confirmpassword").style.borderColor = "red";
        document.getElementById("confirmpassword").style.borderStyle = "solid";
        }

    if(email == "")
        {
        document.getElementById("email").style.borderColor = "red";
        document.getElementById("email").style.borderStyle = "solid";
        } 


    if(password !== "" && confirmpassword !== "" && document.getElementById("password").style.border == "none" && document.getElementById("confirmpassword").style.border == "none" && password !== confirmpassword) { document.getElementById("password").style.border = "red"; document.getElementById("confirmpassword").style.border = "red"; }

    if(firstname && lastname && username && password && confirmpassword && email !== "")
        {
        window.open()
        }
    }
    </script>
    <h><font size=4 color=3BCCBE><b>Full Name</b></font><h/>
    <br>
    <input type="text" id="firstname" size="15px" placeholder="First">
    <input type="text" id="lastname" size="15px" placeholder="Last">
    <br> <br> <br> <br>
    <h><font size=4 color=3BCCBE><b>Choose your username</b></font></h>
    <br>
    <input type="text" id="username" size="37px">
    <br>
    <p><font size=3 color="grey">atleast 6 characters long</font></p>
    <br>
    <h><font size=4 color=3BCCBE><b>Create a password</b></font></h>
    <br>
    <input type="password" id="password" size="37px"> 
    <br> <br> <br> <br>
    <h><font size=4 color=3BCCBE><b>Confirm your password</b></font><h/>
    <br>
    <input type="password" id="confirmpassword" size="37px">
    <br> <br> <br> <br>
    <h><font size=4 color=3BCCBE><b>Email address</b></font><h/>
    <br>
    <input type="text" id="email" size="37px">
    <br> <br> <br> <br>

    <input type="button" value="Submit" onclick="submitinfo()" style="height:50px; width:85px; font-size:22px;>
    <br>
    </body>
    </html>

Answer 1

你省了

document.getElementById("password").style.borderStyle = "solid";

和

document.getElementById("confirmpassword").style.borderStyle = "solid";

Answer 2

设置borderWidth呢？ 不清楚是否已设置。 如果不是，则应设置为1像素。

Answer 3

您可以使用style.border来简单地设置标准边框，如果总是相同的配置，请尝试使其更加动态，请看：

var border_style = "1px solid red";
document.getElementById("password").style.border = border_style;
document.getElementById("confirmpassword").style.border = border_style;

为什么“确认密码”和“确认密码”相同的部分不起作用？

问题描述

3 个解决方案

解决方案1
1 2012-10-23 22:54:24

解决方案2
0 2012-10-23 22:58:49

解决方案3
0 2016-04-12 18:48:10

为什么“确认密码”和“确认密码”相同的部分不起作用？

问题描述

3 个解决方案

解决方案1 1 2012-10-23 22:54:24

解决方案2 0 2012-10-23 22:58:49

解决方案3 0 2016-04-12 18:48:10

解决方案1
1 2012-10-23 22:54:24

解决方案2
0 2012-10-23 22:58:49

解决方案3
0 2016-04-12 18:48:10