Wyłącz Przewijanie Po kliknięciu na link

Question

Mam następujący znaczników HTML, który znajduje się zaledwie trzy wypustki, które po kliknięciu, wyświetlenia wstępnie załadowany tekst w div na stronie,

<a class="page" id="tab1">This is tab!</a> 
    <a class="page" id="tab2">This is tab 2!</a> 
    <a class="page" id="tab3">This is tab3!</a> 

Ten jQuery po prostu ukrywa lub pokazuje tekst, gdy jedna z zakładek są kliknięciu

$(document).ready(function() { 
    $(".page").hide(); 
    $("#tab1").show(); 
}); 
$(".page").click(function() { 
    var id = $(this).attr("href"); 
    $(".page").hide(); 
    $(id).show(); 
}); 

Jednakże, jeśli istnieje strona przepełnienia (czyli strona jest przewijana) po kliknięciu na jednej z zakładek, strona auto-przewija aby wyśrodkować div w rzutnia. Jak mogę temu zapobiec?

Answer 1

Aby zapobiec zwój strona na kliknięcia (po kotwicy hash) używać: Event.preventDefault()

$(".page").click(function(evt) { 

    evt.preventDefault();  // prevents browser's default anchor behavior 

    // Other code here.... 
    $(".page").hide();   // HIDE ALL  .page 
    $("."+ this.id).show();  // SHOW RELATED .(id) 
}); 

Answer 2

<a href="#" class="page" id="tab1" onclick="return false;">This is tab!</a> 

Dodaj return false do wszystkich swoich kotwic.

Answer 3

Jest to domyślne zachowanie dla powiązań z hash. Co chcesz jest zapobieganie domyślne zachowanie przeglądarki, więc trzeba zastosować metodę

$(".page").click(function(event) { 
    var $el = $(this), id = $el.attr("href"); 
    $(".page").hide(); 
    $el.show(); 
    event.preventDefault(); 
});