javascript - 如何在元素上设置默认 focus()

Question

我正在尝试使 Angular 应用程序(使用 D3.js)可通过 Web 访问。

目标:当用户调用特定图表(在本例中为旭日图)时，该图表将展开到 View 中。我的目的是在图表的特定元素上创建默认焦点，以便一旦用户调用/选择图表，图表将自动获得焦点。

问题:一旦我将旭日图展开到 View 中，Tab 键顺序就会从页面开头重置(因为它是单页应用程序，所以没有页面加载)。然后，用户必须按 Tab 键浏览整个页面才能导航到旭日图。我已经将中心节点设置为具有 Tabindex:0 属性。所以现在可以通过键盘导航(选项卡)访问中心节点。

var defaultNode = d3.select(sunburstChartdetail").select("path").attr("tabindex", 0);

我已经尝试过:

  defaultNode.focus(); 

但我收到一个控制台错误，提示“焦点”不是一个函数

注意:不幸的是，由于 NDA 原因，我无法发布代码。

Answer 1

要关注某个元素，您需要获取对底层 DOM 元素的引用:

d3.select("foobar").node().focus()

或者根据您的情况:

defaultNode.node().focus()

Documentation on selection.node()