Question

我有这种js样式，但似乎不起作用。我不知道怎么了


            <div id="SignUp-Password">
              <div id="SignUp-LG-Password">Password:</div>
              <input
                size="42"
                        type="Password"
                maxlength="42"
                        name="SignUp-Input-Password"
                        id="SignUp-Input-Password">
              <input    id="SignUp-CheckBox-Password"
                                    type="checkbox"
                                    name="SignUp-CheckBox-Password">
              <div id="SignUp-Password-Show">Show</div>
              <span id="SignUp-Password-Match/Notmatch"/>
            </div>

            <div id="SignUp-Password-Repeat">
                <div id="SignUp-LG-Password-Repeat">Password Repeat:</div>
              <input
                size="42"
                        type="text"
                maxlength="42"
                        name="SignUp-Input-Password-Repeat"
                        id="SignUp-Input-Password-Repeat">
                    <div id="SignUp-Password-Strong"></div>
              <div class="registrationFormAlert" id="divCheckPasswordMatch"></div>
            </div>

java


    function checkPasswordMatch() {
        var password = $("#SignUp-Input-Password").val();
        var confirmPassword = $("#SignUp-Input-Password-Repeat").val();

        if (password != confirmPassword)
            $("#divCheckPasswordMatch").html("Passwords do not match!").style.color = "red";
        else
            $("#divCheckPasswordMatch").html("Passwords match.").style.color = "green";
    }

    $(document).ready(function () {
       $("#SignUp-Input-Password-Repeat").keyup(checkPasswordMatch);
    });

我认为这对您来说很容易，但是我需要一些有关JavaScript的帮助。您还可以看到此http://jsfiddle.net/fLqujmp3/

Answer 1

您使用语法设置样式错误，请更改为

$("#divCheckPasswordMatch").css("color","red");

如果要使用javascript，请将其更改为

document.getElementById("divCheckPasswordMatch").style.color = "red";

function checkPasswordMatch() {
        var password = $("#SignUp-Input-Password").val();
        var confirmPassword = $("#SignUp-Input-Password-Repeat").val();

        if (password != confirmPassword){
            $("#divCheckPasswordMatch").html("Passwords do not match!");
            document.getElementById("divCheckPasswordMatch").style.color = "red";
            //$("#divCheckPasswordMatch").css("color","red");
            }
        else{
            $("#divCheckPasswordMatch").html("Passwords match.")
             $("#divCheckPasswordMatch").css("color","green");
             }
    }

    $(document).ready(function () {
       $("#SignUp-Input-Password-Repeat").keyup(checkPasswordMatch);
    });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="SignUp-Password">
              <div id="SignUp-LG-Password">Password:</div>
              <input
                size="42"
                        type="Password"
                maxlength="42"
                        name="SignUp-Input-Password"
                        id="SignUp-Input-Password">
              <input    id="SignUp-CheckBox-Password"
                                    type="checkbox"
                                    name="SignUp-CheckBox-Password">
              <div id="SignUp-Password-Show">Show</div>
              <span id="SignUp-Password-Match/Notmatch"/>
            </div>

            <div id="SignUp-Password-Repeat">
                <div id="SignUp-LG-Password-Repeat">Password Repeat:</div>
              <input
                size="42"
                        type="text"
                maxlength="42"
                        name="SignUp-Input-Password-Repeat"
                        id="SignUp-Input-Password-Repeat">
                    <div id="SignUp-Password-Strong"></div>
              <div class="registrationFormAlert" id="divCheckPasswordMatch"></div>
            </div>

JS样式密码有效或密码无效

1 个答案: