0

看看这个小提琴：

http://jsfiddle.net/contendia/GBTAS/

这个想法是通过仅在 js 可以运行时创建选项卡来保持页面对非 js 用户友好。否则，我只想将页面显示为一堆 div。根据选项卡的数量，选项卡的列表是完全自动化的，并且每个选项卡都根据相应的 div id 属性命名。

一切都运行良好，但现在我正在尝试修改 click 事件以更普遍地导航选项卡。之前，我只是在其中一个列表项选项卡 (li) 上查找单击事件，然后运行必要的代码来更改选项卡。

但是现在我想让这个函数更通用，这样当用户点击哈希值等于其中一个选项卡 ID 的任何锚点时，它就可以工作，而不必定位实际的选项卡。我不确定如何在锚点中定位哈希并针对选项卡 ID 对其进行测试。我在 FF 和 IE 中提供的功能既可以用于单击选项卡，也可以用于单击锚链接（例如，<a href="#tab1">Tab 1</a>）。但是，如果选项卡比视口长，选项卡顶部会滚动到窗口顶部，导致选项卡链接消失。用户必须手动将选项卡链接滚动回视图以导航到另一个选项卡。我试过 .scrollTo() 将页面移回原位，但没有运气。

这只是 .scrollTo 的一个问题，还是我的点击功能都错了？

将不胜感激任何想法。奖金，如果它会动画会很棒。

http://jsfiddle.net/contendia/GBTAS/

4

1 回答 1

0

好的，给你..我听说这对你不起作用，但它对我来说非常有用。这是点击选项卡链接时触发的点击处理程序，它会添加哈希值，如您所见。没有“scrollTo（）”，滚动就像你描述的那样......有了它，问题就消失了。然后我得出结论，由于某种原因设置 href 会滚动浏览器视口。

j('#tabs ul li a').click(function () {
    location.hash = j(this).attr('href');
    window.scrollTo(0, 0);
}); // Add click handler to set # in address bar
于 2011-11-04T11:45:16.680 回答