0

<ul>3 つの s とコンテンツ divを含むメニューを含むこの非常に単純なページがあります: http://jsfiddle.net/vvqPN/

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 に読み込まれ、次に 2 番目をクリックすると 2<ul>番目のコンテンツがコンテンツ div に読み込まれ、3 番目のコンテンツも同じように読み込まれます。私が解決しようとしている問題は、ページを下にスクロールしていずれかをクリックしようとすると<ul>、ページが自動的にページの上部に戻ることです。

4

2 に答える 2

6

preventDefault();アンカー タグ (何かへのリンク) の既定の動作を無効にするために使用します。

$('#menu').on('click', 'li:not(.current) a', function (event) { //Add event
  event.preventDefault();
  ...
});
于 2013-08-20T18:47:27.817 に答える
1

アンカー タグのデフォルトのクリック イベントを防止します。それ以外の場合は、URL が変更され、ページがトップに送信されます。

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

http://jsfiddle.net/HM633/

于 2013-08-20T18:48:57.277 に答える