jquery - Jquery タブがちらつき、一番上にスクロールする

Question

タブのヘッドタグに次のものがあります。タブをクリックするとページがちらつき、アニメーションしてページのトップに移動します。

JS

$(document).ready(function(){
    $("a.tab").click(function () {
    $(".active").removeClass("active");
    $(this).addClass("active");
    $(".content").slideUp();
    var content_show = $(this).attr("title");
    $("#"+content_show).slideDown();
    });
});

HTML

<ul id="tabs">
    <li><a href="#" title="type1" class="tab active">type1</a></li>
    <li><a href="#" title="type2" class="tab">type2</a></li>
</ul>
<section id="type1" class="content">
    <p>contents1contents1contents1contents1contents1</p>
</section>
<section id="type2" class="content content_2">
    <p>content</p>
</section>

タブをクリックすると、タブがちらつき、自動的にページの先頭にスクロールしますか?

Answer 1

Try this:

$("a.tab").click(function (e) {// <--------------pass the event
    e.preventDefault(); //<----------------------add this
    $(".active").removeClass("active");
    $(this).addClass("active");
    $(".content").slideUp();
    var content_show = $(this).attr("title");
    $("#"+content_show).slideDown();
});

Answer 2

これを試して

$(document).ready(function(){
    $("a.tab").click(function () {
    var activeTab = $(".active");
    activeTab.removeClass("active")
    $(this).addClass("active");
    $("#"+activeTab.attr("title")).slideUp();
    var content_show = $(this).attr("title");
    $("#"+content_show).slideDown();
    });
});