Question

我创建了一个1个寻呼机网站，但我使用的是js，以避免在网址中看到哈希值。
HTML：

<ul class="click crsl">
    <li><a class="page1 dot active"></a></li>
    <li><a class="page2 dot"></a></li>
    <li><a class="page3 dot"></a></li>
    <li><a class="page4 dot"></a></li>
</ul>

JS：

<script type="text/javascript">
    $(".page1").click(function() {
        $('html, body').animate({
            scrollTop: $("#pageOne").offset().top
        }, 1000);
    });
    <-- up to page4 and #pageFour -->
</script>

所有教程都向我展示了如何在li a标签中添加/删除活动类，但它们都使用`a href =＆＃34;＃idOfDiv＆＃34;。
它会导致我的第一个脚本无用，因为网址将是

http://mywebpage.com/#pageOne

Answer 1

您可以在click处理程序中添加该类：

<script type="text/javascript">
    $(".dot").click(function() {
        $('html, body').animate({
            scrollTop: $("#pageOne").offset().top
        }, 1000);
        $('.active').removeClass('active');
        $(this).addClass("active");
    });
</script>

Answer 2

   <ul class="click crsl">
     <li><a class="page1 dot active"></a></li>
     <li><a class="page2 dot"></a></li>
     <li><a class="page3 dot"></a></li>
     <li><a class="page4 dot"></a></li>
  </ul>

JS：

<script type="text/javascript">
  $("li a").click(function() {
     $('html, body').animate({
        scrollTop: $("#pageOne").offset().top
     }, 1000);
      $('.active').removeClass('active');
      $(this).addClass('active');
});

<-- up to page4 and #pageFour -->
 </script>

是否可以在不使用href的情况下添加类活动？

2 个答案: