javascript - 视障人士无法访问 Asp 验证摘要

Question

在我的 Web 应用程序中，有几种表单使用 asp:ValidationSummary 和 asp:Label 来对表单进行客户端和服务器端验证。但是当我使用屏幕阅读器 (JAWS 16) 在页面上进行可访问性测试时，它只是跳过错误，视障人士不会听到任何错误回读，如果您只是使用键盘导航页面也不会检测到。

因此，如果有人能告诉我一种方法，可以在出现错误时在按下提交按钮后立即关注验证摘要。那太好了，我也可以使用 JavaScript 解决方案，但我真的无法用任何其他类型的验证替换验证摘要，因为表单数量超过 50。

我的错误标签:

      <div>
        <asp:ValidationSummary ID="ValidationSummary2" tabindex="-1" runat="server" ShowMessageBox="false"
           ShowSummary="true" ForeColor="" DisplayMode="List" CssClass="label label-danger"
          ValidationGroup="Registration" />

<asp:Label ID="LblError" runat="server" tabindex="-1" CssClass="label label-danger"></asp:Label>
      </div>

JavaScript:

    function ValidateServerButtonClick() {
        if (typeof (Page_ClientValidate) == 'function') {
            Page_ClientValidate("Registration");
            if (Page_IsValid) {
                return true;
            }
            else {
                return false;
            }
        }
    }

提交按钮:

    <asp:Button ID="btnContinue" CssClass="cui-btn disabled cui-btn-med cui-full-width" 
  runat="server" CausesValidation="true" OnClick="btncontinue_Click"
  OnClientClick="ClearLabel()" Text="Sign up" Enabled="false" ValidationGroup="Registration" />

呈现的 HTML:

我尝试了什么:

我已经尝试通过调用 focus() 有意将焦点设置在错误上，但这也没有用。

Answer 1

将焦点设置到您的容器 DIV 应该可以做到。一旦聚焦，JAWS 就应该开始阅读内容。

function ValidateServerButtonClick() {
            if (typeof (Page_ClientValidate) == 'function') {
                Page_ClientValidate("Registration");
                if (Page_IsValid) {
                    return true;

                }
                else {
                    setTimeout(function () {
            $('#divid').focus();
        }, 700);
                    return false;

                }
            }
        }