8

我想知道是否可以在 url 中使用多个片段标识符，有点像这样： http://example.com/videos/index.html#videos#video_2

我在 index.html 页面上使用 jQuery Tools 选项卡系统和历史插件。此页面的“视频”选项卡上有一个 Flash 视频播放器和视频列表。单击视频缩略图会将文件加载到播放器中。

我希望访问者不仅可以为#videos 标签添加书签，还可以为特定视频添加书签。

我认为在 URL 中有两个片段标识符是实现这一目标的方法是完全错误的吗？

4

4 回答 4

6

我很确定双锚链接是不可能的！

您可以在 url 的查询字符串中放置一个指向正确选项卡和视频的指针（例如 mysite.com/videos/index.html?tab=video&video=2），然后在 JavaScript 中对其进行解析。然后可以添加书签。

但是，您不能坚持使用原始模型（使用单个 # 锚链接），然后简单地使用 JavaScript 来查找该标签所在的选项卡，从而显示正确的选项卡吗？

于 2011-02-11T11:38:40.113 回答
3

不，您不能在一个 URL 中使用多个主题标签。哈希字符后的标识符导致页面上的书签锚点，并且只能转到一个锚点，不能同时转到两个锚点。

如果您正在为视频添加书签，那么 URL 会指向视频，如果您需要在页面中显示特定选项卡，您应该拥有识别视频锚点并显示正确选项卡的代码。

于 2011-02-11T11:39:06.343 回答
2

解析 URL 片段的正则表达式#如下：

(#(.*))?

这意味着可以传递每个字符。因此，请选择以下两种方法之一：

  1. 将第一个散列之后的所有散列转换为“%23”。您还需要对所有不可接受或保留的字符执行此操作（转换为 %HEX eq.）。 例如：http ://domain.com/app#first%23second
  2. 使用多个哈希并在应用程序中处理它！第一个很简单，但可能无法在您的特定应用程序中实现。

请参阅此文档以确保#.

于 2014-08-09T12:14:41.160 回答
1

一个简单的方法是使用这样的链接：

index.html#video_2

然后解析哈希得到视频的ID：

if (location.hash.indexOf("#video_" === 0)) {
    var index = location.hash.indexOf('_')
    var id = location.hash.substring(index + 1)
    // use jQuery to click the 'videos' tab
    // load the video with id
}

您还可以收听“hashchange”事件，以防有人在您的网页上复制/粘贴特定视频的 URL（例如，使用不同的哈希）：

window.addEventListener("hashchange",function(event){
    // check hash for video with ID
});
于 2018-06-08T08:52:02.910 回答