スクリプトはアンカーリンクがURLに表示されないようにしています

Question

私は、ページ内のリンクをアンカーするためにスクロールをスムーズにするために出会ったjQueryを使用しています。このスクリプトにアンカーリンク（例： '#top'）がURLに表示されないようなものがあり、URLにアンカーリンクが必要なことがわかりました。誰かがこれのどの部分がデフォルトの動作を止めているのか、それを元に戻すために何ができるのか教えていただけますか？

<script> 
$(function() { 
    $('a[href*="#"]:not([href="#"])').click(function() { 
    if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) { 
     var target = $(this.hash); 
     target = target.length ? target : $('[name=' + this.hash.slice(1) +']'); 
     if (target.length) { 
     $('html, body').animate({ 
      scrollTop: target.offset().top 
     }, 500); 
     return false; 
     } 
    } 
    }); 
}); 
</script> 

Answer 1

を使用して、アニメーションの完了コールバックに手動でURLハッシュを設定することができますハッシュを設定します。

$(function() { 
 
    $('a[href*="#"]:not([href="#"])').click(function() { 
 
    if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) { 
 
     var hash = this.hash, 
 
      target = $(hash); 
 
     target = target.length ? target : $('[name=' + this.hash.slice(1) +']'); 
 
     if (target.length) { 
 
     $('html, body').animate({ 
 
      scrollTop: target.offset().top 
 
     }, 500, function(){ 
 
      window.location.hash = hash; 
 
     }); 
 
     return false; 
 
     } 
 
    } 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<a href="#foo">bottom</a><br/> 
 
A<br/>B<br/>C<br/>D<br/> 
 
E<br/>F<br/>G<br/>H<br/> 
 
I<br/>J<br/>K<br/>L<br/> 
 
M<br/>N<br/>O<br/>P<br/> 
 
Q<br/>R<br/>S<br/>T<br/> 
 
U<br/>V<br/>W<br/>X<br/> 
 
Y<br/>Z<br/> 
 
<p id="foo">HEY</p>

Answer 2

あなたは、私が実際のページでこれをテストしていませんが、アニメーションの端に、あなたができるwindow.location.hash

$('a[href*="#"]:not([href="#"])').click(function() { 

    var hash = this.hash; 
    if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) { 
     var target = $(hash); 
     target = target.length ? target : $('[name=' + this.hash.slice(1) +']'); 
     if (target.length) { 
     $('html, body').animate({ 
      scrollTop: target.offset().top 
     }, 500, 'swing', function(){ 
      window.location.hash = hash; 
     }); 
     return false; 
     } 
    } 
    });