Anchor跳过页面内的部分

Question

我正在尝试在我的应用程序中使用JavaScript和Angular 2实现“Anchor Jumping”功能，意味着用户可以跳过页面内的部分。

根据客户要求，用户可以使用按Ctrl + Shift +向左/向右箭头键跳转（导航）该部分。

在这里，我添加一个快照以清除问题，如下所示。

例如，假设首次关注菜单，用户按下Ctrl + Shift +右箭头，此时焦点应转到下一个元素项（即面包屑部分或任何部分）。

我很困惑，如何管理动态加载内容？ （我如何在我的部分中计算这个动态内容？）

请建议任何想法来实现此功能。

Answer 1

你需要的是焦点管理员。 我不打算从头开始写一篇文章， Angular Focus Manager就是如何解决这个问题的一个例子。 它还包含Mousetrap.js，它添加​​了快捷方式指令。

您的动态内容始终可以包含在管理其焦点的某些内容（甚至是div）中。

我希望这有帮助！