Question

我需要覆盖fuelux树的Tab键顺序（tabindex）值。

页面内容依次：
-Fuelux树（包含多个项目和分支项目）
-Component X

现在，如果我将任何tabindex值（甚至最大值32767）设置到组件X，那么该组件X将选项卡焦点作为页面上的第一项。相反，fuelux树应该先得到它。

如何制定正确的订单？

一些例子（您可以将按钮更改为任何其他组件 - 我对这里树的Tab键设置原则感兴趣）：

    <div class="fuelux menu-tree">
        <ul id="myTreeVerticalNav" class="tree" role="tree">
            <li class="tree-branch hide" data-template="treebranch" role="treeitem" aria-expanded="false">
                <div class="tree-branch-header">
                    <a href="#" class="tree-branch-name">
                        <span class="glyphicon icon-caret glyphicon-play"></span>
                        <span class="glyphicon icon-folder glyphicon-folder-close"></span>
                        <span class="tree-label"></span>
                    </a>
                </div>
                <ul class="tree-branch-children" role="group"></ul>
                <div class="tree-loader" role="alert">Loading...</div>
            </li>
            <li class="tree-item hide" data-template="treeitem" role="treeitem">
                <a href="#" class="tree-item-name" target="_self">
                    <span class="glyphicon icon-item fueluxicon-bullet"></span>
                    <span class="tree-label"></span>
                </a>
            </li>
        </ul>
    </div>

    <button class="btn btn-standard">Component X</button>

Answer 1

您应该能够通过向数据源中的attr对象添加密钥，将tabindex属性值添加到树项目节点。请参阅此处获取文档：http://getfuelux.com/javascript.html#tree-usage-datasource

这是我用来展示如何向树项添加标签索引的CodePen：http://codepen.io/anon/pen/aNZPEw?editors=0010

按Tab键顺序覆盖fuelux树

1 个答案: