Javascript 基于验证结果在ASP中应用jQuery效果

我有一个带有控制面板的网络表单（#pnlStepOne）。该面板包括两个文本字段“txtFname”和“txtLname”。我为每个文本字段设置了一个验证程序。我已经按照要求测试了表格和所有作品

我的问题是，仅当一个（或两个）文本字段（“txtFname”和“txtLname”）未验证时，如何向panel onclick事件添加jQuery效果。（这种效果会“震动”面板）

我想添加另一个jQuery效果来“翻转”控制面板，并将当前的（#pnlStepOne）切换到另一个（#pnlStepTwo），如果两个字段都由asp:RequiredFieldValidators验证

只是一个示例代码，一旦我有了正确的If条件，我将对其进行调整

$(document).ready(function () {
        $("#btnStepOne").click(function (event) {
            if (**this is the condition that I am missing**)
            {
                $('#pnlStepOne').css({
                    background: 'red',
                });                
            }
        });
    });

---

这里有一个类似问题的答案：

此处有MSDN链接：

在我的一个项目中，我使用了一个

prettifyValidation

函数，因此您可以有如下功能：

$(document).ready(function () {
    $("#btnStepOne").click(function (event) {
        prettifyValidation();
    });
});



function prettifyValidation() {
    var allValid = true;
    if (typeof Page_Validators != 'undefined') {
        // Loop through from high to low to capture the base level of error
        for (i = Page_Validators.length; i >= 0; i--) {
            if (Page_Validators[i] != null) {

                if (!Page_Validators[i].isvalid) { // The Control is NOT Valid
                    $("#" + Page_Validators[i].controltovalidate).removeClass("makeMeGreen").addClass("makeMeRed");

                    allValid = false;
                } else { // Control is valid
                    $("#" + Page_Validators[i].controltovalidate).removeClass("makeMeRed").addClass("makeMeGreen");
                };
            };
        };
    };
}

这将遍历页面上连接了ASP.NET验证程序的所有控件，然后根据它们是否有效添加或删除类

---

显然，从这里，您可以通过匹配

controlToValidate

属性将函数限制为特定的控件，并且您可以重新设置样式、添加控件、更改类，但这有望为您的工作提供一个良好的基础。

您可以将代码修改为：

$(document).ready(function () {
    $("#btnStepOne").click(function (event) {
        var fvFname = document.getElementById('client-id-of-your-fvFname-validator');
        var fvLname = document.getElementById('client-id-of-your-fvLname-validator');
        ValidatorValidate(fvFname);
        ValidatorValidate(fvLname);
        if (!fvFname.isvalid || !fvLname.isvalid) {
            $('#pnlStepOne').css({
                background: 'red',
            });
        }
    });
});

---

您使用什么进行验证？您是否使用默认的ASP.NET验证程序（如

ASP:RequiredFieldValidator

）？@Stefano-是的，我使用默认的ASP.NET验证程序<代码>谢谢您的回答。非常有帮助！