自动jquery scrollTo导航

Question

  

http://jsbin.com/ifutav/2/edit

我想使用http://balupton.github.com/jquery-scrollto/demo/自动滚动相对导航链接。使用下面的代码，这是我得到的错误：Uncaught Error: Syntax error, unrecognized expression: #/article/这显然是由斜杠（这是ajax插件所需的命名空间）引起的，当我删除它们时，错误消失但仍然无法正常工作：http：//jsbin.com/ifutav/3/edit但e.preventDefault()确实如此。显然，这里发生了两个错误：

1. jQuery不喜欢href值
2. scrollTo无法正常工作

HTML：链接

<nav id="nav">
  <ul>
    <li><a href="#/item-1/">Item 1</a></li>
    <li><a href="#/item-2/">Item 2</a></li>
    <li><a href="#/item-3/">Item 3</a></li>
    <li><a href="#/item-4/">Item 4</a></li>
  </ul>
</nav>

HTML：元素

<section id="/item-1/"></section>
<section id="/item-2/"></section>
<section id="/item-3/"></section>
<section id="/item-4/"></section>

的Javascript

$('nav ul li a[href^="#"]').each(function() {

  // store values so it doesn't have to execute onclick
  var $this = $(this),
      value = $this.attr('href'),
      element = $(value);

  $this.click(function(e) {

    // prevent default scrolling
    e.preventDefault();

    // scrollTo element
    element.scrollTo();
  });
});

我不知道这些方面背后的原因，但我认为它们是某种类型的错误？ IDK的...

提前致谢。

Answer 1

两件事：1）从你的href和id中删除正斜杠。 2）如果您使用http://balupton.github.com/jquery-scrollto/demo/，则ScrollTo方法需要大写字母S：element.ScrollTo();

参见工作示例：http://jsfiddle.net/dBh3W/