Доступность элемента управления YUI Tree: как вставить вкладку в дерево в Firefox?

Question

Рассмотрим пример, показывающий дерево YUI в действии:

http://developer.yahoo.com/yui/examples/treeview/tv_edit.html

1. Выберите заголовок в оранжевый ("TreeView Control: Инлайн редактирование TreeView Node Labels").
2. Вкладка «Хит» в первый раз: выбрана ссылка «Посмотреть пример в новом окне».

3. Хит-вкладка второй раз: это выбирает якорь внутри дерева.

   Label 0 not highlighted http://img.skitch.com/20091218-61eqs6gcngp8ay56s1pba3jhb.png

4. Оттуда вы можете использовать клавиши вверх/вниз для навигации по дереву. Текущий элемент всегда выделяется цветом фона.

   Label 1 is highlighted http://img.skitch.com/20091218-es5xh4g4k41d8s133hay65ufrr.png

Вопрос заключается в том, что фон текущего элемента не выделен на шаге 3 выше (но при навигации по дереву на шаге 4). Является ли это ошибкой дерева YUI или есть способ программно выделить текущий элемент, когда дерево получает фокус?

Answer 1

«Фиксировать» для этого является регистрация слушателя на якорях внутри узла, когда якорь получает фокус для поиска соответствующего узла и вызывает node.focus(). Добавление следующее render() в treeview.js делает трюк:

var anchors = this.getEl().getElementsByTagName("a"); 
for (var anchorIndex = 0; anchorIndex < anchors.length; anchorIndex++) { 
    var anchor = anchors[anchorIndex]; 
    Event.on(
     anchor, 
     'focus', 
     function (ev) { 
      var target = Event.getTarget(ev); 
      var node = this.getNodeByElement(target); 
      node.focus(); 
     }, 
     this, 
     true 
    ); 
} 

Answer 2

Это полностью не подходит для меня (с использованием Google Chrome), но, глядя на код, дерево является уклоном от вложенных таблиц. Я бы избегал этого, как чумы, если вы серьезно относитесь к доступности.

Answer 3

Узел потеряет фокус при щелчке элемента на странице, на которой можно принять фокус. Нажатие на узел в дереве даст этому узлу фокус. Каждый экземпляр узла имеет метод focus(), поэтому вы можете вручную сфокусировать любой узел в дереве, когда захотите, - это именно то, что этот пример делает, чтобы выделить второй узел.