Question

我正在使用javascript进行平滑滚动（在下面的脚本标签中），并且还有href用于锚链接。所有锚点工作正常，但javascript似乎禁用了URL的href。你能帮我改写一下这样吗？

<ul class="snip1143">
    <li class><a href="#home1" data-hover="Home">Home</a></li>
    <li><a href="#about1" data-hover="About">About</a></li>
    <li><a href="#experience1" data-hover="Work">Work</a></li>
    <li><a href="URL HERE" data-hover="Blog">Blog</a>   </li
    <li><a href="#contact1" data-hover="Contact">Contact</a></li>

<script>

  $(document).on('click', 'a', function(event) {
      event.preventDefault();

      $('html, body').animate({
          scrollTop: $( $.attr(this, 'href') ).offset().top
      }, 500);
  });

</script>

Answer 1

event.preventDefault（）将阻止默认值，锚点将转到该URL。您可能希望将类添加到要设置动画的锚点，并仅选择那些而不是阻止所有锚标记的默认值。

Answer 2

由于每个元素都有唯一的data-hover，因此我们只需验证其data-hover属性的值即可对其进行过滤。

<script>

  $(document).on('click', 'a', function(event) {
      if($(this).data('hover') !== "Blog"){       
       $('html, body').animate({
          scrollTop: $( $.attr(this, 'href') ).offset().top
       }, 500);
    }// since i noticed that you want to redirect the page once the Blog link is clicked
  });

</script>

如果这可以帮助您解决问题，请告诉我。

网址href失败：锚点，网址和Javascript

2 个答案: