Jquery 跳转到内容

我正试图创建一个网站，通过点击标签来满足某些可访问性标准。问题是我在屏幕的左侧有一个导航菜单，我的用户请求一个“跳到内容类型”链接，这样他们就不必不断地循环浏览多个链接才能到达内容所在的位置

但是，我在我的web应用程序中使用AngularJS，如果我使用标准的“跳到内容”功能示例：它将不起作用。我已经在为角度代码使用锚和

有没有其他方法来实现这一点？我有一个特定的div标签，我希望选项卡选择转到该标签。它应该转到div中的一个元素。

我以前使用过效果很好的方法。它是轻量级的8.5kB，易于使用，甚至可以为您处理滚动动画。它还符合可访问性标准，因为Tab键可以像普通的锚定标记一样用于导航

这样实施：

JS

HTML

工作代码笔供参考：

狩猎快乐

我最近与您一起工作，并为您提供了一些建议

在模板中：

<a href="javascript:void(0)" ng-click="scrollTo('hello-scroll')">Go</a>
...
<div id="hello-scroll">Hello Scroll!</div>

我添加$timeout调用的原因是，当我在没有它的情况下测试它时，$scrollTo似乎不起作用。对$location.hashhash的调用似乎需要一些很短的时间来处理，因此需要100毫秒的等待

---

希望它能起作用。

你可以添加按钮/链接，然后单击只需关注你想要的任何元素-有什么问题吗？问题是我的内容可以更改；因为我使用的是模板和ui路由器。因此，我需要它转到content中元素的选项卡索引，您可以使用特殊指令/id/class在每个页面上“标记”content中的第一个元素。或者，您可以选择页面上的所有可选项卡元素并跳过导航按钮。这不是一个很酷的方式，但至少是这样。问题是我使用的是角度用户界面路由器。因此，当用户单击链接时，不会刷新整个页面。它必须使用模板将其他页面的内容加载到当前主页中。这在那里不起作用，因为我需要转到内容。它没有选择内容。我需要它来选择。如果用户使用tab键进行导航并按enter键，则他们需要转到内容并查看所选内容。这似乎不是键盘导航所需的内容。

<a href="#nav-one" du-smooth-scroll duration="1500">Navigation Link</a>

<!-- further down the page -->

<div id="nav-one">
  Content goes here.
</div>

<a href="javascript:void(0)" ng-click="scrollTo('hello-scroll')">Go</a>
...
<div id="hello-scroll">Hello Scroll!</div>

angular
   .module('someModule', [])
   .controller('scrollCtrl', function($scope, $timeout, $timeout, $anchorScroll) {

        /**
         * @name    scrollTo
         * @desc    Anchor scrolling within page using $anchorScroll
         * @param   {String}   hash - Element ID.
         * @return  void
         */
        $scope.scrollTo = function(hash) {
           $location.hash(hash);
           $timeout(function() {
              $anchorScroll();
            }, 100);
        }

    });