使用NVDA屏幕阅读器的向导控件,在多步骤asp.net webform中集中讨论问题

时间:2017-07-03 09:15:33

标签: asp.net accessibility wai-aria screen-readers nvda

我正在使用ASP.NET向导控件来显示多步骤过程。我必须使用NVDA屏幕阅读器和所有浏览器访问该表单。可以在Chrome中访问该表单,因为NVDA正在从顶部读取屏幕

此标题

按顺序排列到底部。但是当在Firefox + NVDA中检查相同的表单时,焦点有时会转移到中间,有时会转移到页脚。我的要求是屏幕阅读器应始终从所有向导步骤中的

这是标题

中读取。拜托,我需要你的帮助来解决这个问题。我的代码如下:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WizardRadioButtonListDemo.Default" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Accessibile Form</title>    
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <asp:Wizard ID="Wizard1" runat="server" DisplaySideBar="false">
                <HeaderTemplate>
                    <h1>This is header</h1>
                </HeaderTemplate>
                <WizardSteps>                  
                    <asp:WizardStep ID="WizardStep1" runat="server" Title="Step 1">
                        <fieldset id="Fieldset1" runat="server">
                            <legend id="Legend1" runat="server">Type</legend>
                            <asp:RadioButtonList ID="rdoServiceType" RepeatLayout="Flow" runat="server">
                                <asp:ListItem Text="Gold" Value="0">Gold</asp:ListItem>
                                <asp:ListItem Text="Siver" Value="1">Silver</asp:ListItem>
                                <asp:ListItem Text="Premium" Value="2">Premium</asp:ListItem>
                            </asp:RadioButtonList>
                        </fieldset>
                    </asp:WizardStep>
                    <asp:WizardStep>
                        <asp:FileUpload ID="FileUpload1" runat="server" />
                        <asp:Button ID="btnFileUpload" runat="server" Text="Upload" />
                    </asp:WizardStep>
                    <asp:WizardStep ID="WizardStep2" runat="server" Title="Step 2">
                        <fieldset id="Fieldset2" runat="server">
                            <legend id="Legend2" runat="server">User</legend>
                            <asp:Label ID="lblFirstName" runat="server" Text="First Name" AssociatedControlID="txtFirstName"></asp:Label>
                            <asp:TextBox ID="txtFirstName" runat="server"></asp:TextBox>
                            <asp:Label ID="lblLastName" runat="server" Text="Last Name" AssociatedControlID="txtLastName"></asp:Label>
                            <asp:TextBox ID="txtLastName" runat="server"></asp:TextBox>
                        </fieldset>
                    </asp:WizardStep>
                </WizardSteps>
            </asp:Wizard>
        </div>
    </form>
      <p>&copy; 2017 <a href="http://www.test.com" target="_blank">Test LLC.</a>. All rights reserved. Powered by <a href="http://www.test.com" target="_blank">Test</a></p>

</body>
</html>

1 个答案:

答案 0 :(得分:0)

好的,这就是我认为的问题。因此,您希望用户通过Tab键读取h1。一种解决方案是在标题中添加一个0的制表符索引。

<强>为什么吗

因为默认情况下html,唯一的可列表元素是链接,按钮和&amp;投入。 H1和p标签不能做到这一点。但是如果你给它们一个0的标签索引......

所以加上这个:

        <HeaderTemplate tabindex="0">
            <h1>This is header</h1>
        </HeaderTemplate>

我可能会错误地解释你的问题。如果情况并非如此,您可以随时在表单中添加正值的制表符索引。

例如:tab-index="1"

......等等,继续上去。