javascript - anchor 链接在另一个页面中打开灯箱

Question

我在弄清楚一个非常简单的交互时遇到了一些问题。

一些背景:我正在开发一个网站，该网站在网格中展示一些产品，单击时，会弹出一个包含产品信息的灯箱..非常简单!大致我的标记/脚本:

<img id="1234" src=".../blah.jpg"></img>

$( img ).click(function() {
  // open (this) lightbox
  // etc. etc.
});

现在我正在尝试实现搜索功能，该功能显然存在于另一个页面中。搜索返回一个产品列表，每个产品都有一个路径，例如:

<a href="/parentCat/childCat/#1234">Product 1234</a>

因此，如果我单击该项目，它会将我带到该项目所在的正确页面，并且由于我包含了 anchor 链接，因此它将使其对用户可见。这很好用。

我的问题是，如何让灯箱从搜索定向到产品所在的实际类别页面后自动打开？

这似乎非常简单，但由于某种原因我无法弄清楚!任何帮助将不胜感激!

谢谢!

Answer 1

因此，当 dom 在类别页面上准备就绪时，您需要检查 url 以查看 anchor 是否存在。这意味着他们是通过搜索结果页面到达的。

引用: How can you check for a #hash in a URL using JavaScript? 。

类似这样的事情:

 if(window.location.hash) {
      var hash = window.location.hash.substring(1); //Puts hash in variable, and removes the # character
      alert (hash);
      // hash found
      // open (this) lightbox
  } 

如果存在，从主题标签获取产品 ID 并触发灯箱功能