标签: keyboard-navigation

在WPF中设置Tab键顺序

如何在WPF中设置标签排序?我有一个ItemsControl,其中一些项目已展开,一些项目已折叠,并且当我选中时,我想跳过折叠的项目.

有任何想法吗?

.net wpf tab-ordering keyboard-navigation

90
推荐指数
5
解决办法
9万
查看次数

Safari/Opera的bug是否有解决方法,您无法通过超链接进行制表?

在IE,Firefox,Chrome和我使用过的大多数基于Windows的界面中,Tab密钥可用于从一个表单字段或超链接导航到下一个(例如"可操作"项目)(注意:我还没有在其他项目上测试过)操作系统)

但是,当Tab键时,Safari和Opera会跳过网页中的所有超链接.恕我直言,它是一个可用性错误,但我离题了.

是否有解决方法/黑客使Safari和/或Opera浏览这些链接?

我注意到Opera将接受该tabindex属性,如果设置,例如tabindex="0"因此在页面上的DOM流中保持链接"索引"......但Safari不想接受这一点.

对于那些感兴趣的人,这一点jQuery将使所有的超链接都可以表示.

//Make links 'tab-able' in Opera
$(document).ready(function(){
  if($.browser.opera){
    $('a[href]').attr('tabindex', 0);
  }
});
Run Code Online (Sandbox Code Playgroud)

...虽然这似乎适用于Opera ...有更好的解决方法吗?

safari opera keyboard-navigation

23
推荐指数
2
解决办法
9896
查看次数

WPF中的TabIndex与KeyboardNavigation.TabIndex

TabIndexKeyboardNavigation.TabIndexWPF有什么区别?什么时候使用?

.net wpf focus keyboard-navigation tabindex

17
推荐指数
2
解决办法
1万
查看次数

在Bootstrap下拉菜单中启用键盘导航

是否可以使用键盘导航到下拉菜单Tab,并使用箭头键导航到下拉菜单的子元素?

这是我现在的代码:

<input type="text" value="click tab to jump to the drop down."/>
<div class="bs-docs-example">
    <div class="dropdown clearfix">
      <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu" style="display: block; position: static; margin-bottom: 5px; *width: 180px;">
        <li><a tabindex="-1" href="#">Menu Item A</a></li>
        <li><a tabindex="-1" href="#">Menu Item B</a></li>
        <li><a tabindex="-1" href="#">Menu Item C</a></li>
        <li class="divider"></li>
        <li><a tabindex="-1" href="#">Menu Item A1</a></li>
            <li class="dropdown-submenu">
                <a tabindex="-1" href="#">Menu Item B1</a>
                <ul class="dropdown-menu">
                    <li><a tabindex="-1" href="#">You should navigate here with the keyboard.</a></li>
                    <li><a tabindex="-1" href="#">Thanks For your Help!</a></li>
                </ul>
            </li>
      </ul> …
Run Code Online (Sandbox Code Playgroud)

accessibility keyboard-navigation twitter-bootstrap

14
推荐指数
1
解决办法
2万
查看次数

KeyboardNavigationMode包含和循环之间的区别?

简短的问题 - 简单易懂的词汇中真正的区别是什么?

来自MSDN的摘录:

  • 包含 - 根据导航的方向,焦点返回到达容器的结束或开头时的第一个或最后一个项目,但不会移动到容器的开头或结尾.
  • 循环 - 根据导航的方向,当到达容器的结束或开始时,焦点将返回到第一个或最后一个项目.焦点不能使用逻辑导航离开容器.

区别在于这些模式的描述的最后部分.但我无法理解.任何人都可以用更人道的方式解释它吗?

wpf mode keyboard-navigation

10
推荐指数
1
解决办法
6406
查看次数

如何防止Tab键到UserControl?

我有一个自定义弹出窗口覆盖我的部分屏幕.当它打开时,我想禁用Tabbing到它后面的UserControl.我不想使用该IsEnabled属性,因为我不想灰显所有控件.

还有另一个属性做同样的事情吗?IsTabStop仅阻止选项卡在UserControl本身上停止,而不是它的子项,并且IsFocusable不是UserControl的有效属性.

wpf xaml focus keyboard-navigation

10
推荐指数
2
解决办法
7639
查看次数

DataGrid选项卡导航跳过列

我在WPF中有一个带有模板列的数据网格.网格中的几列是只读的,焦点上的其他列变得可编辑(而不是标签,文本框,复选框等).

我想要实现的是当我浏览网格列时跳过readonly列.

谁知道如何实现这一目标?

谢谢!弗拉丹


不,不工作:(

这是完整的单元格...单独使用KeyboardNavigation.IsTabStop和IsTabStop尝试了...没有用

<DataGridTemplateColumn Header="{x:Static local:MainWindowResources.gasNameLabel}" Width="*" MinWidth="150" IsReadOnly="True">
    <DataGridTemplateColumn.CellTemplate>
        <DataTemplate>
            <ContentControl Content="{Binding Path=Name}" ContentTemplate="{StaticResource DataGridTextBoxView}" />
        </DataTemplate>
    </DataGridTemplateColumn.CellTemplate>
    <DataGridTemplateColumn.CellStyle>
        <Style TargetType="{x:Type DataGridCell}">
            <Style.Triggers>
                <Trigger Property="IsReadOnly" Value="true">
                    <Setter Property="KeyboardNavigation.IsTabStop" Value="False"/>
                </Trigger>
            </Style.Triggers>
        </Style>
    </DataGridTemplateColumn.CellStyle>
</DataGridTemplateColumn>
Run Code Online (Sandbox Code Playgroud)

wpf datagrid focus keyboard-navigation datagridcell

7
推荐指数
1
解决办法
5637
查看次数

仅使用css和html的隐藏内容的键盘可访问性

如何才能使此代码段可访问?

<div tabindex="0">
    Show More
    <ul>
        <li><a href="#">Hidden Content</a></li>
        <li><a href="#">Hidden Content</a></li>
        <li><a href="#">Hidden Content</a></li>
    </ul>
</div>
Run Code Online (Sandbox Code Playgroud)

CSS:

div > ul
    {display:none;}
div:hover > ul, div:focus > ul
    {display:block;}
Run Code Online (Sandbox Code Playgroud)

我想知道<ul>在聚焦其内容时是否可以通过键盘导航使其可见

http://jsfiddle.net/pJs2U/

html css accessibility keyboard-navigation

7
推荐指数
1
解决办法
2807
查看次数

如何在WPF Expander控件上设置TabIndex?

在此示例窗口中,Tabbing through从第一个文本框转到最后一个文本框,然后转到扩展器标题.

<Window x:Class="ExpanderTab.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Window1" Height="300" Width="300"
    FocusManager.FocusedElement="{Binding ElementName=FirstField}">
    <StackPanel>
        <TextBox TabIndex="10" Name="FirstField"></TextBox>
        <Expander TabIndex="20" Header="_abc">
            <TextBox TabIndex="30"></TextBox>
        </Expander>
        <TextBox TabIndex="40"></TextBox>
    </StackPanel>
</Window>
Run Code Online (Sandbox Code Playgroud)

显然,我希望这是第一个文本框,扩展器标题,然后是最后一个文本框.有没有一种简单的方法可以将TabIndex分配给扩展器的标头?

我已经尝试强制扩展器使用tabstop KeyboardNavigation.IsTabStop="True",但这会使整个扩展器获得焦点,并且整个扩展器不会对空格键做出反应.再过两次选项卡后,再次选择标题,我可以用空格键打开它.

编辑:我会为那些能够提出更清洁方式的人提供奖励 - 如果没有,那么rmoore,你可以拥有代表.谢谢你的帮助.

wpf expander keyboard-navigation

6
推荐指数
1
解决办法
6105
查看次数

使用 TAB 继续时,焦点链接隐藏在固定位置页脚后面时的可访问性

我遇到了有关可访问性的细节,不是关于屏幕阅读器和盲人用户,而是关于纯键盘导航。


编辑/添加:我想强调我的问题的一部分,到目前为止我得到的两个答案中根本没有解决:我想知道我的代码片段中给出的情况是否可以被认为是可访问的,即符合可访问性标准?


我在页面上有一个博客文章列表,其标题链接到实际(单个)帖子 - 标准博客行为。现在,当有人使用 TAB 键导航并从一个链接/博客标题前进到下一个链接/博客标题时,页面将始终自动滚动以在页面的可见部分内显示聚焦的链接。

但是,如果我有固定的页脚(页眉也一样),则在某些时候焦点链接将被页脚隐藏。我不是在谈论页面上的最后几行!尝试下面的代码片段:单击一个可见链接将其聚焦,然后使用 TAB 键跳转到下一个,然后是下一个,依此类推:在某些时候,聚焦的链接将位于页脚后面。当我在页面已经向下滚动后返回(使用 Shift + Tab)时也是如此:在某些时候,焦点链接位于固定标题后面。

在这种情况下,设置顶部和底部填充或边距没有帮助......

我知道可以使用箭头键手动向下滚动,但首先我想知道这是否仍然可以被认为是完全可访问的,除此之外,我只是想知道是否有任何东西可以使浏览器将焦点元素滚动到它所在元素的可见部分?

html,
body {
  margin: 0;
  height: 100%;
}
ul {
  padding: 40px 0 80px;
}
li {
  font-size: 24px;
  padding: 10px;
}

header {
  position: fixed;
  top: 0;
  height: 40px;
  width: 100%;
  background: rgba(33, 233, 158, 1);
  text-align: center;
}

footer {
  position: fixed;
  bottom: 0;
  height: 80px;
  width: 100%;
  background: rgba(33, 233, 158, 0.8);
  text-align: center;
}

footer p {
  padding: 0 60px;
} …
Run Code Online (Sandbox Code Playgroud)

css accessibility wcag keyboard-navigation

6
推荐指数
1
解决办法
4181
查看次数