jquery - 将内容加载到 div

Question

我有这个非常简单的页面，其中包含三个<ul>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 中，然后当您单击第二个内容时，第二<ul>个内容会加载到内容 div 中，第三个内容也是如此。我要解决的问题是，当您在页面中向下滚动并尝试单击任何<ul>s 时，页面会自动返回到页面顶部。

Answer 1

用于preventDefault();禁用锚标记的默认行为（链接到某物）。

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

Answer 2

防止锚标签的默认点击事件。否则，更改 url，并将页面发送到顶部。

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

http://jsfiddle.net/HM633/