javascript - Jquery Validation resetForm()函数不起作用

Question

好的，我有一个包含是和否单选按钮的表单。当用户单击其中一个时，它会触发一个 radioChanged() 函数，该函数检查哪个框被选中。如果没有被选中，它会显示电子邮件字段并根据规则验证表单。如果用户再次单击"is"，我需要重置和清除验证，但它似乎不起作用。如果选中不需要电子邮件字段的"is"，我是否应该进行新的验证？

<script type="text/javascript">
    var validator = $("#newClient");

    function radioChange() {
        if (document.getElementById("yesbutton").checked == true) {
            document.getElementById("emailSpan").style.display = "none";
            document.getElementById("cemailSpan").style.display = "none";
            document.getElementById("emailError").style.display = "none";
            document.getElementById("cemailError").style.display = "none";
            validator.resetForm();
        } else if (document.getElementById("nobutton").checked == true) {
            document.getElementById("emailSpan").style.display = 'block';
            document.getElementById("cemailSpan").style.display = 'block';
            document.getElementById("emailError").style.display = "block";
            document.getElementById("cemailError").style.display = "block";

            validator.validate({
                rules: {
                    Email: {
                        required: true,
                        minlength: 4,
                        maxlength: 48,
                        email: true
                    },
                    ConfirmEmail: {
                        required: true,
                        minlength: 4,
                        maxlength: 48,
                        email: true,
                        equalTo: "#Email"
                    }
                },
                messages: {
                    Email: {
                        required: "Please enter a valid email address",
                        email: "Please enter a valid email address",
                        maxlength: "Max length is 48"
                    },
                    ConfirmEmail: {
                        required: "Please enter a valid email address",
                        email: "Please enter a valid email address",
                        maxlength: "Max length is 48",
                        equalTo: "Emails do not match"
                    }
                },
                errorPlacement: function(error, element) {
                    if (element.attr("name") == "ConfirmEmail") error.appendTo("#cemailError");
                    else if (element.attr("name") == "Email") error.appendTo("#emailError");
                }
            })
        }
    }
</script>

Answer 1

你好 Jacob， 看来您需要了解一些基础知识才能创建基础良好且整洁的 Java 脚本代码。我认为您的代码的问题在于您正在制造一些有时无法看到的小问题。这是更新后的代码，请告诉我这是否有效。

var validator = $("#newClient");

function radioChange() {
    if (document.getElementById("yesbutton").checked === true) {
        document.getElementById("emailSpan").style.display = "none";
        document.getElementById("cemailSpan").style.display = "none";
        document.getElementById("emailError").style.display = "none";
        document.getElementById("cemailError").style.display = "none";
        validator.resetForm();
    } else if (document.getElementById("nobutton").checked === true) {
        document.getElementById("emailSpan").style.display = 'block';
        document.getElementById("cemailSpan").style.display = 'block';
        document.getElementById("emailError").style.display = "block";
        document.getElementById("cemailError").style.display = "block";

        validator.validate({
            rules: {
                Email: {
                    required: true,
                    minlength: 4,
                    maxlength: 48,
                    email: true
                },
                ConfirmEmail: {
                    required: true,
                    minlength: 4,
                    maxlength: 48,
                    email: true,
                    equalTo: "#Email"
                }
            },
            messages: {
                Email: {
                    required: "Please enter a valid email address",
                    email: "Please enter a valid email address",
                    maxlength: "Max length is 48"
                },
                ConfirmEmail: {
                    required: "Please enter a valid email address",
                    email: "Please enter a valid email address",
                    maxlength: "Max length is 48",
                    equalTo: "Emails do not match"
                }
            },
            errorPlacement: function(error, element) {
                if (element.attr("name") === "ConfirmEmail") {
                    error.appendTo("#cemailError");
                }
                else if (element.attr("name") === "Email") {
                    error.appendTo("#emailError");
                }
            }
        });
    }
}

希望对您有所帮助!