3

我有一个使用 jQuery UI Tabs 小部件的网站，它适用于“ye old versions”，jQuery: 1.5.1, jQuery UI: 1.8.4。

对站点进行其他更改/升级，我想移动到这两个包的更新版本，通过逐步升级到每个包的“下一个主要版本”来实现它。无需更改我自己的几行 js 代码，我就可以使用 jQuery 1.8.3 和 jQuery UI 1.8.24，一切仍然正常。

将 jQuery 升级到 1.9.1，单击选项卡似乎会触发页面的重新加载，而不是切换选项卡。所有选项卡都是静态的，所以不应该有任何 ajax 问题。

页面的 URL（它是 Typo3 安装的一部分）具有以下格式：

https://server.some.where/?id=49&project_id=13&action_type=display

单击选项卡时，会生成基本 href + #tab-X 的 HTTP GET：

https://server.some.where/#tabs-2

由于早期版本的 jQuery 没有启动 HTTP GET，而是愉快地切换选项卡，所以我很难过。阅读相关 jQuery 版本的变更日志，我看不到任何匹配的内容，但那可能只是我...... :-)

升级 jQuery UI (1.9.2/1.10.2) 会产生另一个问题 - 所有选项卡都是从头开始打开的（所有 div 一个接一个地显示）。

相关HTML：

<div id="display-tabs">
  <ul class="tabs">
    <li><a href="#tabs-1">...</a></li>
    <li><a href="#tabs-2">...</a></li>
    <li><a href="#tabs-3">...</a></li>
  </ul>
  <div id="tabs-1">...</div>
  <div id="tabs-2">...</div>
  <div id="tabs-3">...</div>
</div>

激活标签小部件非常简单：

$('#display-tabs').tabs();

jQuery 是从 Google 获取的，看起来也不错：

<link rel="stylesheet" media="screen" type="text/css" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.24/themes/smoothness/jquery-ui.css" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.24/jquery-ui.min.js"></script>

我暂时在测试站点上消除了 jQuery 的大多数其他用途，但这些问题似乎仍然存在。欢迎任何想法...

4

1 回答 1

1

这个问题是一个已知的问题，但我花了一段时间来连接这些点并使用正确的搜索词 - 很抱歉！

简而言之，jQuery 1.9 及更高版本将<base href="URL">锚点的组合和链接<a href="#tab-X">视为不是页面本地的链接。这种行为可能比早期版本中发生的更正确，但这种变化破坏了许多建立在依赖基本标签的框架上的网站。我的本地解决方案是在定义选项卡的列表中提供完整链接，如下所示//$HTTP_HOST/$REQUEST_URI#tab-X：

有关此问题的更多信息：

于 2013-03-19T11:48:22.547 回答