我在标签的head标签上有以下内容。当我点击标签时,我的页面会闪烁,它们会动画并转到页面顶部。
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>
当我点击标签时,标签会闪烁并自动滚动到页面顶部?
答案 0 :(得分:0)
试试这个:
$("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();
});
答案 1 :(得分:0)
试试这个
$(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();
});
});