平滑滚动浏览js中的问题

Question

我正在尝试使用js顺利滚动，但它无法正常工作。我的代码出了问题。结构是这样的。

HTML

<ul class="nav">
                    <li><a target="main" id="main-nav">Home</a></li>
                    <li><a target="club" id="club-nav">Club</a></li>
                    <li><a target="contact" id="contact-nav">Contact</a></li>
                    <li><a target="about" id="about-nav">About</a></li>
</ul>
<div class="wrap">
  <div id="main"></div>
  <div id="about"></div>
  <div id="contact"></div>
  <div id="updates"></div>
</div>

JS

$('#main-nav').click(function() {
    $('body').animate({
        scrollTop: eval($('#' + $(this).attr('target')).offset().top - 70)
    }, 1000);
});

$('#club-nav').click(function() {
    $('body').animate({
        scrollTop: eval($('#' + $(this).attr('target')).offset().top - 70)
    }, 1000);
});