最適化されたjQuery

Question

私は最適化を助けたいと思う少しのjQueryを持っています。

スクリプトは正常に動作しますが、スクリプトを使用する複数のdivがある場合は混乱します。ここで

はここでjQueryの

jQuery(document).ready(function() { 
     jQuery(".anchorLink").anchorAnimate() 
    }); 

    jQuery.fn.anchorAnimate = function(settings) { 
     settings = jQuery.extend({ 
      speed : 400 
     }, settings); 

     return this.each(function(){ 
      var caller = this 
      jQuery(caller).click(function (event) { 
       event.preventDefault() 
       var locationHref = window.location.href 
       var elementClick = jQuery(caller).attr("href") 

       var destination = jQuery(elementClick).offset().top; 
       jQuery("html:not(:animated),body:not(:animated)").animate({ scrollTop: destination}, settings.speed, function() { 
        window.location.hash = elementClick 
       }); 
       return false; 
      }) 
     }) 
    } 

ある典型的なHTMLコードです：

<div id="container1"> 
<ul class="Questions"> 
<li class="anchorLink" href="#myAnchor"> 
<a class="faq-topic-link anchorLink" href="#myAnchor"> 
<span class="topic_ questionTitle">FAQ Question</span> 
</a> 
</li> 
</ul> 


<ul class="aAnswers"> 
<li class="li_answers"> 
<a name="myAnchor" id="myAnchor"></a> 
<span class="topic-head" id="topics_">FAQ Question</span> 
Lorim Ipsum ... 
<div class="back-to-top"> 
<a href="#faqtop" class="anchorLink">Back To Top</a></div> 
<div class="clear"></div> 
</li> 
</ul> 
</div> 

私はページ上の他の場所に上記のHTMLコードを使用しようとすると、問題のような...それ自身を示しますこの：

"this"を使用して正しく作っていると思っていたので、 "この"コンテナと合致させる。

Answer 1

あなたのHTMLを見ると、それはあなたの問題の原因となっているコードかもしれません。典型的には、hrefのプロパティは、固有のIDにナビゲートするために使用される。今、html要素のidプロパティは一意でなければなりません。アンカータグは、別のアンカーにナビゲートする必要はないことに留意すべきである。彼らは一意に識別された要素にナビゲートすることができます。同じIDを持つ2つの要素がある場合、ナビゲーションはDOM内で最初に一致するIDに移動します。

与えられたhtmlから、両方のアンカータグは同じidを持ちます。これらのIDを一意にすると、結果が表示されます。多分何か：

<a name="myAnchor" id="myAnchor" href="#navigateFromFirstAnchor">Go to First Div</a> 
<div id="navigateFromFirstAnchor"></div> 

<a name="mySecondAnchor" id="mySecondAnchor" href="#navigateFromSecondAnchor">Go To Second Div</a> 
<div id="navigateFromSecondAnchor"></div> 

は、id属性hereとアンカータグhereのマニュアルを参照してください。