内容跳转问题中带有锚的jquery选项卡

我正在尝试链接jquery选项卡式内容中的锚。我已经让它工作了，但是，现在当我点击选项卡时，页面跳转到选项卡内容div的顶部，并切断选项卡。我希望它停留在同一地点没有滚动时，标签点击。我还需要从URL访问每个选项卡和内部锚点，只需要选项卡URL不要跳转到选项卡内容div的顶部，切断顶部的选项卡。例如：

以下是我到目前为止的情况：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">

$(function() {
$('a.refresh').live("click", function() {
      location.reload();
});
 });
</script>

<section class="wrap">

<div class="tablist">
<ul class="tabs">
<li><a href="#tab1">Tab 1</a></li>
<li><a href="#tab2">Tab 2</a></li>
<li><a href="#tab3">Tab 3</a></li>

</ul>
</div>
<div class="panes">
<div id="tab1" class="tab-content">
Tab 1 content
<br />
<a name="anchor1" id="anchor1">Anchor 1</a>
</div>

<div id="tab2" class="tab-content">
Tab 2 content
</div>

<div id="tab3" class="tab-content">
Tab 3 content
<br />
<a name="anchor2" id="anchor2">Anchor 2</a>
</div>

</div>
</section>

<script type="text/javascript">
$(document).ready(function() {
var $tabContent = $(".tab-content"),
    $tabs = $("ul.tabs li"),
    tabId;

$tabContent.hide();
$("ul.tabs li:first").addClass("current").show();
$tabContent.first().show();

$tabs.click(function() {
    var $this = $(this);
    $tabs.removeClass("current");
    $this.addClass("current");
    $tabContent.hide();
    var activeTab = $this.find("a").attr("href");
    $(activeTab).fadeIn();

});

// Grab the ID of the .tab-content that the hash is referring to
tabId = $(window.location.hash).closest('.tab-content').attr('id');

// Find the anchor element to "click", and click it
$tabs.find('a[href=#' + tabId + ']').click();
 })

$('a').not('.tabs li a').on('click', function(evt) {
evt.preventDefault();
var whereTo = $(this).attr('goto');
$tabs = $("ul.tabs li");
$tabs.find('a[href=#' + whereTo + ']').trigger('click');

$('html, body').animate({
    scrollTop: $('#'+whereTo+' a').offset().top });


 });
 </script>

$（函数（）{
$（'a.refresh'）.live（“单击”，函数（）{
location.reload（）；
});
});





表1内容


锚1
表2内容
表3内容


主播2
$（文档）.ready（函数（）{
var$tabContent=$（“.tab content”），
$tabs=$（“ul.tabs li”），
塔比德；
$tabContent.hide（）；
$（“ul.tabs li:first”）.addClass（“current”）.show（）；
$tabContent.first（）.show（）；
$tabs。单击（函数（）{
var$this=$（this）；
$tabs.removeClass（“当前”）；
$this.addClass（“当前”）；
$tabContent.hide（）；
var activeTab=$this.find（“a”）.attr（“href”）；
$（activeTab.fadeIn（）；
});
//获取哈希所引用的.tab内容的ID
tabId=$（window.location.hash）.closest（'.tab-content'）.attr（'id'）；
//找到要“单击”的锚元素，然后单击它
$tabs.find（'a[href=#'+tabId+']）。单击（）；
})
$（'a'）。非（'tabs li a'）。关于（'click'，函数（evt）{
evt.preventDefault（）；
var whereTo=$（this.attr（'goto'）；
$tabs=$（“ul.tabs li”）；
$tabs.find（'a[href=#'+whereTo+']）。trigger（'click'）；
$（'html，body'）。设置动画({
scrollTop:$（“#”+whereTo+“a”）.offset（）.top}）；
});

任何想法、想法或帮助都将不胜感激

---

谢谢

您需要将其添加到事件中以停止其默认行为

preventDefault();

看

因此，对于任何锚定标记，您需要停止其行为

$('#yourselector').click(function(e){
    e.preventDefault();
});

---

您需要将其添加到事件中以停止其默认行为

preventDefault();

看

因此，对于任何锚定标记，您需要停止其行为

$('#yourselector').click(function(e){
    e.preventDefault();
});

---

如果这是您试图阻止的，为什么代码中会有一个动画滚动条？对于内容中的锚，它会设置动画以转到这些锚。如果这是您试图阻止的，为什么代码中会有一个动画滚动条？对于内容中的锚，我仍然有一些关于标签URL的问题，比如说：。。。它仍然跳转到选项卡内容div的顶部，而不是页面的顶部。你对此有什么建议吗？不确定你想做什么，在url中添加#tab1默认情况下会导致你的页面滚动到具有该ID的元素，在你的情况下，该ID将是tab1，如果链接是用于此目的，为什么要将其转到页面顶部？如果有人直接从另一个页面访问该页面，我们希望他们能够看到其他标签和网站的标题，但有所需的标签打开。希望这是有意义的：）但是，如果它是一个附加了锚点#anchor1的url，我们希望它直接向下滚动到该元素ID。因此，是的，我们有两个相互冲突的结果。如果我理解正确，那么您需要读取url参数并采取相应的行动，你可以用这个来读取参数，我仍然有一些关于标签URL的问题，比如外部标签：。。。它仍然跳转到选项卡内容div的顶部，而不是页面的顶部。你对此有什么建议吗？不确定你想做什么，在url中添加#tab1默认情况下会导致你的页面滚动到具有该ID的元素，在你的情况下，该ID将是tab1，如果链接是用于此目的，为什么要将其转到页面顶部？如果有人直接从另一个页面访问该页面，我们希望他们能够看到其他标签和网站的标题，但有所需的标签打开。希望这是有意义的：）但是，如果它是一个附加了锚的url，#anchor1，我们希望它直接向下滚动到该元素ID。因此，是的，我们有两个相互冲突的结果。如果我理解正确，那么您需要读取url参数并采取相应的行动，您可以使用此