Jquery选项卡在选项卡中加载当前网址

问题描述：

使用jQuery的UI选项卡。这是我的代码。Jquery选项卡在选项卡中加载当前网址

<div id="tabs"> 
    <ul> 
    <li><a href="#tabs-1">Find a Category</a></li> 
    <li><a href="#tabs-2">Business Name</a></li> 
    <li><a href="#tabs-3">All Categories</a></li> 
    <li><a href="#tabs-4">Business to Business</a></li> 
    </ul> 
    <div style="clear:both;"></div> 
    <div id="tabs-1"><p>Tab 1</p></div> 
    <div id="tabs-2"><p>Tab 2</p></div> 
    <div id="tabs-3"><p>Tab 3</p></div> 
    <div id="tabs-4"><p>Tab 4</p></div> 
    </div> 
</div>

发起这样的...

$(function() { 
    $('#tabs').tabs(); 
});

我的网站上的一些网页它完美的作品。在其他页面上，href="#tabs-x"被预置为页面的路径，例如， <a href="#tabs-1">Find a Category</a>变成<a href="/page/path/#tabs-1">Find a Category</a>（在这种情况下，页面将在/ page/path /中找到）。发生这种情况时，它认为它需要使用Ajax并最终将页面重新加载到选项卡中。

真奇怪的是，它不会发生在每一页上（尽管它在大多数页面上都会发生）。例如

http://cbpstage.eblairsolutions.net/online/all-categories/- 伟大工程 http://cbpstage.eblairsolutions.net/online/business-to-business/ - 失败。

我已验证页面（它们不完美，但以完全相同的方式失败）。我使用IDM的ultracompare比较了它们。它们是不同的页面，所以存在一些差异，但没有任何材料可以检测到导致href的行为不同。

我已经花了整整一天的时间，只有一个秃顶的头显示它。会爱别人看这个。

你用什么语言来生成这些页面？它只是静态的HTML，还是ASPX或PHP或其他？另外，你的选项卡div是静态还是由代码生成（意味着你正在从db中读取某些内容并动态地构建div）？ – 2010-08-21 23:43:30

它是PHP，Typo3 CMS（v4.4）。尽管如此，我仍在使用静态代码。最终它会变得更加复杂，但我故意让它陷入故障排除。 – 2010-08-22 00:02:24

如果你在提取一个静态代码块，这是否意味着你的'href'是'＃tabs-X'，然后以某种方式被替换为'/ page/path /＃tabs-X'？奇怪的。我不是PHP开发人员，所以我不确定我可以在那里帮忙。 – 2010-08-22 03:09:56

答

D Hoerster是在正确的轨道上。路径似乎来自服务器。要么你跟踪它，或者你可以在你的$('#tabs').tabs(...声明之前添加下面的jQuery：

$('#tabs a').each(function(){ 
    $(this).attr('href',"#"+$(this).attr('href').split('#')[1]); 
});

编辑：新增"#"+

这确实杀死了直到＃点的路径。但是，标签插件不能识别内容div，并且正在编写它自己的内容。＃tab-1，＃tab-2被忽略。 href生成为＃ui-tabs-1，＃ui-tabs-2等。然后它创建具有相同ID的空白内容div - 就好像它将要发起ajax调用一样。不拉入页面，但它会忽略我的内容。 – 2010-08-22 02:41:12

对不起，我错过了''''''split''之后的'tab-n'。见上面的编辑。 – 2010-08-22 02:45:11

我仍然建议追查根本原因，但这是一个有趣的解决方案。我没有想到这一点。 – 2010-08-22 03:06:50

答

我最初的直觉反应是你正在建立你的标签DIV。我不知道后端语言/平台，但在ASP.NET中，你可以当你建立你的URL引用做这样的事情：

~/#tab-1

和~将被解释为对解决根目录。所以，如果你的实际页面（不是你的路线）是几个深度级别，那么~将追加到该HREF的几个级别。

我并不是说那就是发生了什么，但是这似乎正在发生。调查您的标签DIV的制作过程，您如何将href添加到您的<a>标签中，然后从那里开始。如果您可以用这些信息更新您的问题，我会相应地更新我的答案。

希望这会有所帮助！

Jquery选项卡在选项卡中加载当前网址

相关推荐