私はHTML内に、そのHTML位置のコンテンツを現在のページのcontents
divにロードするために使用するHTMLに以下のアンカータグを持っています。このアンカータグは、私は目次を生成するために使用するブートストラップツリービュープラグインの一部です:アンカータグhrefがそのページにジャンプしないようにします。
<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を別のページから現在のページにロードした後、後続の呼び出しでどのようにアンカーの場所(つまり章)にスクロールすることができますか?次のように
あなたはfalseを返す 'てみました;'だけでなくpreventDefault' 'として? – DavidG
chromeの開発ツールを使用してデバッグして、毎回prevLocationの値を確認できますか? – klikas
'return false'は' nodeSelected'イベントが呼び出されないようにしますが、アンカーセレクタの下にある2つの関数を組み合わせて、 'nodeSelected'イベントを取り除いてfalseを返すと、動作するようです。 – occasl