Jquery anchor hrefがサイト全体に影響を与えます

Question

私はjqueryで新しく、Cedric Dugasによって作成されたjqueryアンカーコードを使用しようとしています。うまくいきますが、＃を使用しないカスタムリンクがあれば、そのリンクはどこにもリダイレクトされません。

私の知る限り、event.preventDefault（）はGoogleのリンクをブロックし、これを無効にする方法がわかりません。私を助けてください！ありがとうございました。

/******* 
 

 
\t *** \t Anchor Slider by Cedric Dugas *** 
 
\t *** Http://www.position-absolute.com *** 
 
\t 
 
\t Never have an anchor jumping your content, slide it. 
 

 
\t Don't forget to put an id to your anchor ! 
 
\t You can use and modify this script for any project you want, but please leave this comment as credit. 
 

 
\t ~ MODIFIED! ~  
 
\t 
 
*****/ 
 
\t \t 
 

 
jQuery.fn.anchorAnimate = function(settings) { 
 

 
    \t settings = jQuery.extend({ 
 
\t \t speed : 500, 
 
\t \t offset : 0 
 
\t }, settings); \t 
 
\t 
 
\t return this.each(function(){ 
 
\t \t var caller = this 
 
\t \t $(caller).click(function (event) { \t 
 
\t \t \t event.preventDefault(); 
 
\t \t \t var locationHref = window.location.href; 
 
\t \t \t var elementClick = $(caller).attr("href"); 
 
\t \t \t 
 
\t \t \t var destination = $(elementClick).offset().top - settings.offset; 
 

 
\t \t \t if (destination < 0) { 
 
\t \t \t \t destination = 0; 
 
\t \t \t } 
 

 
\t \t \t $("html:not(:animated),body:not(:animated)").animate({ scrollTop: destination}, settings.speed, function() { 
 
\t \t \t \t 
 
\t \t \t }); 
 
\t \t \t return false; 
 
\t \t }) 
 
\t }) 
 
}

<div> 
 
      <ul> 
 
       <li> 
 
        <a href="#link1"> Homepage </a> 
 
       </li> 
 
      </ul> 
 
      <ul> 
 
       <li> 
 
        <a href="#link2"> Product </a> 
 
       </li> 
 
      </ul> 
 
      <ul> 
 
       <li> 
 
        <a href="#link3"> About us </a> 
 
       </li> 
 
      </ul> 
 
</div> 
 
<div> 
 
     <ul> 
 
       <li> 
 
        <a href="https://www.google.com"> Google link </a> 
 
       </li> 
 
      </ul> 
 
</div>

Answer 1

基本的にはリンクが持っているかいないかどうかを確認する必要があります。

これはさまざまな方法で行うことができますが、私は最も簡単な方法の1つを投稿します。 このコードでコードブロックを囲むことができます。if($(caller).attr("href").charAt(0) == "#"){}。単にhrefの最初の文字が＃であるかどうかをチェックし、そうであれば何もしません。

jQuery.fn.anchorAnimate = function(settings) { 

    settings = jQuery.extend({ 
     speed : 500, 
     offset : 0 
    }, settings); 

    return this.each(function(){ 
     var caller = this 
     $(caller).click(function (event) { 
      if($(caller).attr("href").charAt(0) == "#"){ 
      event.preventDefault(); 
     var locationHref = window.location.href; 
     var elementClick = $(caller).attr("href"); 

     var destination = $(elementClick).offset().top - settings.offset; 

     if (destination < 0) { 
      destination = 0; 
     } 

     $("html:not(:animated),body:not(:animated)").animate({ scrollTop: destination}, settings.speed, function() { 

     }); 
     return false; 
     } 
     }) 

    })