如何获得href的值，并使其滚动到锚点

Question

所以我试图让我的导航使用jquery滚动，但由于某种原因，它不工作。我尝试了一堆解决方案，但似乎都没有工作。

我的代码：

HTML：

<nav class="column column-12 navigation nav"> 
     <ul> 
     <li class="active onee"><a href="#home" class="scrollable">Home</a></li> 
      <li class="onee"><a href="#portfolio" class="scrollable">Portfolio</a></li> 
      <li class="onee"><a href="#about" class="scrollable">About</a></li> 
       <li class="onee"><a href="#contact" class="scrollable">Contact</a></li> 
     </ul> 
     </nav> 
    </div> 
    </div> 

，我的所有部分具有相同的类主播HREF。

的jQuery：

$(document).ready (function() { 
$(".nav li").click(function() { 
$(".nav li").removeClass("active"); 
$(this).addClass("active"); 
}); 


var $clicked = $('a').attr('href').split("#").val(); 
$("a").click(function() { 
/*$(this).find('a').attr('href').split("#");*/ 
var url = $(this).attr("href"); 
$("body").animate({ 
/*scrollTop: $('.' + $kazkas).offset().top 
}, 1000);*/ 
scrollTop: $("." + url.split("#")).offset().top 
}, 1000); 
}); 
}); 

在这里，我试图让点击锚标记的值，并用它只是摆脱＃和添加滚动我的身体“”所以定位我的部分类名称。不幸的是，不起作用。 http://codepen.io/Limpuls/pen/YGdmkW

任何想法：

的完整代码可以在我的codepen找到？

谢谢。

Answer 1

拆分后，它会转换成数组。比方说，

var url = "#home"; 

与url.split分裂（“＃”）

var arr = url.split("#"); 
// arr[0] = '' 
// arr[1] = "home" 

打完，所以如果你不想把它分配给变量，那么你可以直接使用如下

url.split("#")[1] 

此外，您还需要防止默认锚标记事件。要做到这一点，

$("a").click(function (e) { 
    e.preventDefault(); 
    e.stopPropagation(); 

    // your code 

});