如何让 CustomValidator（使用 JS）验证 OnBlur 或 OnChange

Question

我目前正在使用一个 CustomValidator，它使用 JavaScript 来验证其中一个/或文本框是否包含数字。当我满足验证错误时，消息在提交之前不会清除。我该如何解决这个问题，以便它像我的其他开箱即用的验证器一样清除？我正在使用带有 C# 的 ASP.NET。

      <script type="text/javascript">

               function testnumbers(source, args) {
                   var s1 = document.getElementById('<%=arubaBox.ClientID%>').value; var s2 = document.getElementById('<%=shipBox.ClientID%>').value;


                   if (s1 == "" && s2 == "")

                       args.IsValid = false;
                   else if (s1 == "" && s2 != "")

                       args.IsValid = true;
                   else if (s1 != "" && s2 == "")

                       args.IsValid = true;
                   else if (s1 != "" && s2 !== "") args.IsValid = true;

               }

        </script>



   <asp:TextBox ID="aBox" runat="server" MaxLength="7"></asp:TextBox>



  <asp:CustomValidator 
    ID="CustomValidator1" runat="server"                       ClientValidationFunction="testnumbers" 
    ErrorMessage="CustomValidator"
     ValidationGroup="Contact"
     Text=" Please provide A # or Shipping Account #" 
    CssClass="errormessage"
     Display="Dynamic" >
    </asp:CustomValidator>

 &nbsp<asp:RegularExpressionValidator
        id="RegularExpressionValidator1"
        runat="server"
        ErrorMessage="Field not valid!"
        ControlToValidate="aBox"
        ValidationExpression="[0-9a-zA-Z]{5,}"
        ValidationGroup="Contact"
         />&nbsp

 <asp:RegularExpressionValidator 
    ID="NumErrAru" 
    runat="server"
    ControlToValidate="aBox"
     CssClass="errormessage" 
     ErrorMessage=" Numbers Only"
     ValidationExpression="^[0-9]+$"
     ValidationGroup="Contact" 
    Display="Dynamic" 
    Text=" Numbers Only">
    </asp:RegularExpressionValidator>

Answer 1

您可以使用 Page_ClientValidate 方法和 Page_Validators 集合来控制您的页面验证：

function jsValidation(){
    Page_ClientValidate();
    $.each(Page_Validators, function(key, value) { 
        if( value.IsValid == false) {
            //- error in validation, locate failing input control 
            var oE = value.ControlToValidate; 
            //- you can for example set focus back to it, if needed
            oE.focus();
        }
    });
}

当元素失去焦点时使用blur事件调用你的函数：

$('#<%=element.ClientID%>').blur(function() {   jsValidation(); }); 

此实现使用 jQuery，尚未经过测试，但应该可以正常工作。 如果需要，您还可以简单地删除 jQuery 交互并使用经典 js。

希望这会有所帮助。