內容加載到DIV

我有菜單這個非常簡單的頁面，包含三個<ul> S和內容DIV：http://jsfiddle.net/vvqPN/內容加載到DIV

的jQuery：

$(document).ready(function() { 
    $('.subcontent:gt(0)').hide(); 
    $('#menu').on('click', 'li:not(.current) a', function() { 
     $('.current').not($(this).closest('li').addClass('current')).removeClass('current'); 
     // fade out all open subcontents 
     $('.subcontent:visible').hide(600); 
     // fade in new selected subcontent 
     $('.subcontent[id=' + $(this).attr('data-id') + ']').show(600); 
    }); 
});

在頁面，當你點擊第一個<ul>第一個內容加載到內容div中，然後當您單擊第二個<ul>時，第二個內容加載到內容div中，第三個內容加載到第二個內容中。我正在試圖解決的問題是，當你在頁面向下滾動，並嘗試點擊任何<ul> S中的頁面自動返回到頁面頂部。

來源

2013-08-20 System-x32z

你的錨鏈接正在尋找定義爲''＃不存在的，因此，將其發送給你的文件頂部的錨。你可以指定''作爲你錨鏈接的'href'，或者你可以做下面建議的@kunalbhat。我建議@ kunalbhat的答案，因爲它是不顯眼的。 – crush

使用preventDefault();禁用錨標籤（鏈接到的東西）的默認行爲。

$('#menu').on('click', 'li:not(.current) a', function (event) { //Add event 
    event.preventDefault(); 
    ... 
});

來源

2013-08-20 18:47:27 kunalbhat

擊敗了我。 :) –

偉大的解決方案，謝謝 –

有什麼更好的解決辦法，你還是另外一個，爲什麼？老實說 –

防止錨標記的默認點擊事件。否則，URL將被更改，並且頁面將被髮送到頂端。

$('#menu').on('click', 'li:not(.current) a', function (e) { 
    e.preventDefault();

http://jsfiddle.net/HM633/

來源

2013-08-20 18:48:57

被重新加載頁面，或只是將它們發送到頂部，因爲錨標籤不存在？ – crush

沒有重新加載，只是返回頂部 –

對不起，我的錯誤。 –

內容加載到DIV

回答

相關問題