Question

说明： 这个html页面有3个部分。单击引导选项卡作为图像（顶部）应滚动到选项卡式内容。在每个标签选项卡内容中，您有一个（中间）部分，其中的价格范围将过滤下面的产品块（底部）。

问题＃1 设置锚标签时，单击选项卡，它应向下滚动到选项卡式内容。问题：单击选项卡时，锚标签滚动仅适用于第一个选项卡。

问题＃2 双击选项卡时，选项卡式内容将消失。错误？

代码：http://www.bootply.com/jasonethedesigner/YbdSPgyAb5#

Answer 1

我不知道您为什么要从标签窗格中删除活动类并尝试添加到当前的一个，Bootstrap正在这样做自动。
问题＃1：如果你想这样做，你必须改变你的index 变量值，因为它总是返回0，这就是你的标签窗格在第二次点击时消失的原因，你必须使用父（index()元素）上的li函数：

var index = jQuery(this).parent().index() - 1;

问题＃2：它应滚动但不会滚动，因为当您点击第2或第3个标签时，它们会display: none，因此浏览器不知道滚动的位置，可以在您的点击事件中使用它：

var target = jQuery($(this).attr('href'));
setTimeout(function() {
  jQuery('html,body').animate({
    scrollTop: jQuery(target).offset().top
  }, 'slow');
}, 50);

BOOTPLY

Answer 2

对于问题#2：这是因为 display: none 的第二个和第三个标签！您可以使用 display: block 在标签顶部创建一个 div，并在单击标签后将其设置为滚动目标。

Twitter Bootstrap选项卡双击问题//选项卡内容问题中的锚点标记

2 个答案:

BOOTPLY