1

再会,

请参阅此jsfiddle 演示,客户端需要将深度链接功能添加到现有代码中。

我曾尝试使用“ Hash histroy with jQuery BBQ ”来构建同位素的内置功能,但这不是客户想要的,原因是:

(1) 他们希望显示的 URL 以斜杠“/”而不是井号“#”运行

(2) 同位素jQuery BBQ示例应用于过滤器按钮而不是特定同位素“itemSelector”

这就是客户想要的

(a) 使用特定的深度链接 url,浏览器将加载选择特定项目的页面$this.addClass('selected');

(b) 通过点击itemSelector: '.item',地址栏上的其他项目 url 将更改而不刷新页面

表达能力不足见谅,为了更好的理解,请参考www.jwt.com。我无法对整个站点进行逆向工程,因此使用 jQuery isotope 作为我的方法。

我正在考虑在单击同位素 itemSelector 时添加某种代码,

$items.click(function () {
  var $this = $(this);
  // don't proceed if already selected
  var $previousSelected = $('.selected');
  if (!$this.hasClass('selected')) {
    $this.addClass('selected');
  }

  $previousSelected.removeClass('selected');

  // update sortData for new items size
  $container.isotope('updateSortData', $this)
    .isotope('updateSortData', $previousSelected)
    .isotope();

});

提前谢谢了!

4

2 回答 2

1

(1) 他们希望显示的 URL 以斜杠“/”而不是井号“#”运行

我真的建议不要在单个页面响应中使用“/”作为菜单导航命令。“/”是表示 URI 层次结构的保留(ascii 2F)字符。在html 规范中使用的时间大约可以追溯到你想去的地方。根据您的影响,自 1994 年以来制作的每个客户端浏览器、网络爬虫都可能在自定义使用“/”时表现异常

我只是希望您对使用“/”做出明智的决定。它可能会产生意想不到的后果。我建议选择不会重新使用 URI 保留字符的任何内容。

说了这么多,是可以做到的。

  1. 如果您必须使用斜线,那么您将不得不在您的网络服务器中使用“通配符 URL”映射支持。http://your.domain.com/base/url/**--> 某个页面(分层定义在此停止,并且开始使用 url 的文档片段)
  2. 像 jwt 站点一样,使用 cookie 来存储用户的点击偏好,因为您将破解您的 URL 以满足客户的要求。

  3. 您需要听取点击或同位素更新事件以使 cookie 保持最新

  4. 防止bbq 过滤出现在 url 中,并将其更改为用户要求的“/”。

  5. 在页面加载时读取您的 cookie,并使用必要的选项启动isotope,以便页面看起来与他们上次访问时相同。

于 2013-02-06T18:37:28.917 回答
1

您正在寻找的是HTML5 History API。这允许您在不重新加载页面的情况下修改 URL 栏中显示的内容。您将希望使用一个库,例如History.js,而不是直接使用 API。

于 2013-02-04T16:48:13.957 回答