Question

当我点击选项卡ID，我的演示链接时，我试图控制页面跳转 http://jsfiddle.net/bala2024/x9ypj/

function showSection( sectionID ) {
    $('div.section').css( 'display', 'none' );
    $('div'+sectionID).css( 'display', 'block' );
}
$(document).ready(function(){
    if (
        $('ul#verticalNav li a').length &&
        $('div.section').length
    ) {
        $('div.section').css( 'display', 'none' );
        $('ul#verticalNav li a').each(function() {
            $(this).click(function() {
                showSection( $(this).attr('href') );
            });
        });
        $('ul#verticalNav li:first-child a').click();
    }
});

Answer 1

首先，您可以替换

.css( 'display', 'block' );

只是

.show();

而且，

.css( 'display', 'none' );

与

.hide();

最后，为了防止链接行为，您需要更改此块.-

$('ul#verticalNav li a').each(function() {
    $(this).click(function() {
        showSection( $(this).attr('href') );
    });
});

为此.-

$('ul#verticalNav li a')
    .click(function(e) {
        showSection( $(this).attr('href') );
        e.preventDefault();
    });

Answer 2

阻止锚标记的默认行为。看看更新的小提琴

$('#verticalNav a').click(function(){
    return false;
});

http://jsfiddle.net/x9ypj/1/

Answer 3

最好的方法是使用它：

$('#verticalNav a').click(function(e){
    e.preventDefault();
});

如何修复页面滚动

3 个答案: