2016-09-19 20 views
0

私はHTML内に、そのHTML位置のコンテンツを現在のページのcontents divにロードするために使用するHTMLに以下のアンカータグを持っています。このアンカータグは、私は目次を生成するために使用するブートストラップツリービュープラグインの一部です:アンカータグhrefがそのページにジャンプしないようにします。

私はJavaScriptで
<a href="/Introduction/index.html#1-1-overview1" style="color:inherit;">1.1 Overview</a> 

、私は私は2つのイベントをリッスンするために使用する次のコードを持っています。私はデフォルトの動作を無効にするように、アンカータグとアンカータグを処理し、内容をロードし、次のようにアンカーにスクロールする他の一つは:

$("a[href*='#']").click(function(e) { 
     e.preventDefault(); 
    }); 

    // Add smooth scrolling to all links inside a navbar 
    $treeview.on('nodeSelected', function (e, data) { 
     e.preventDefault(); 

     if (data && data.href !== "") { 
      // Split location and hash 
      var hash = data.href.match(/[#].*/g)[0]; 
      var location = data.href.match(/[^#]*/g)[0]; 

      if (prevLocation === location) { 
       // Don't reload page if already at same location as last clicked 
       $('html, body').animate({ 
        scrollTop: $(hash).offset().top - 55 
       }, 200); 
      } else { 
       prevLocation = location; 
       $('#contents').load(location, function() { 
        $('html, body').animate({ 
         scrollTop: $(hash).offset().top - 55 
        }, 200); 
       }); 
      } 

     } 
     $body.scrollspy('refresh'); 
     $sideBar.affix('checkPosition'); 
    }); 

私は何を見ていことです初めてクリックすると、その私の目次のノードは、期待どおりにコンテンツdivにHTMLを読み込みますが、それをクリックすると、前回と同じようにロードしていたかどうかを確認するためにアンカータグで参照されるHTMLページがロードされます上記の条件付き論理。私はまた、その後のクリックで、アンカーセレクターが呼び出されていないことに気付きました。

TOCが最初にHTMLを別のページから現在のページにロードした後、後続の呼び出しでどのようにアンカーの場所(つまり章)にスクロールすることができますか?次のように

+1

あなたはfalseを返す 'てみました;'だけでなくpreventDefault' 'として? – DavidG

+0

chromeの開発ツールを使用してデバッグして、毎回prevLocationの値を確認できますか? – klikas

+1

'return false'は' nodeSelected'イベントが呼び出されないようにしますが、アンカーセレクタの下にある2つの関数を組み合わせて、 'nodeSelected'イベントを取り除いてfalseを返すと、動作するようです。 – occasl

答えて

0

二つの機能を組み合わせるとfalseを返すが動作するように表示されます。

 $("a[href*='#']").click(function(e) { 
     e.preventDefault(); 

     if (this && this.href !== "") { 
      // Split location and hash 
      var hash = this.href.match(/[#].*/g)[0]; 
      var location = this.href.match(/[^#]*/g)[0]; 

      if (prevLocation === location) { 
       // Don't reload page if already at same location as last clicked 
       $('html, body').animate({ 
        scrollTop: $(hash).offset().top - 55 
       }, 200); 
      } else { 
       prevLocation = location; 
       $('#contents').load(location, function() { 
        $('html, body').animate({ 
         scrollTop: $(hash).offset().top - 55 
        }, 200); 
       }); 
      } 

     } 
     $body.scrollspy('refresh'); 
     $sideBar.affix('checkPosition'); 
     return false; 
    }); 
+1

一般的に、他の人のコメントを使って質問に答えるのはかなり悪いフォームなので、最初に自分の答えを追加する機会を与えてください。 – DavidG

+0

LOL ...それでも答えてください。私はこの1つを削除し、あなたに信用を与えるでしょう。申し訳ありませんが私はあなたを先制。 – occasl

+0

必要はありません。あなたは既にそれを行いました。ここであなた自身の答えを受け入れることができます。私は正直に、信用や担当者に気にしない、ちょうどあなたにいくつかの人々がひどく反応するかもしれないことを知らせることだった。 – DavidG

関連する問題