javascript - 使用 jQuery UI 加载页面并突出显示 anchor div

Question

我正在尝试以类似于 StackOverflow 的方式设置我的 anchor 标记，如果我在页面 A 上并单击指向页面 B 上的 div 的链接，则该 div 将通过 jQuery UI 突出显示，突出显示 功能。我无法弄清楚如何将 anchor 链接传递到新页面并突出显示它。这是页面场景。

页面A

...
<a href="/albums/1#track-1

B页

<!-- /albums/1#track-1 -->

<div class="tracklist">
  ...
  <div id="track-1" class="track">Track 1</div> <!-- Highlights this div -->
  <div id="track-2" class="track">Track 2</div>
  <div id="track-3" class="track">Track 3</div>
  ...
</div>

除了设置本身之外，我还有一些性能问题。理想情况下，我认为您必须在每个页面加载上循环遍历每个.track，无论这些特定的div是否在页面上。做到这一点的最佳方法是什么？

Answer 1

您在 html 代码中写错了 id，请删除“#”符号。像下面这样的东西就可以解决问题。

$(document).ready(function() {
  var url = window.location.href; // Returns full current url.
  var hash = url.substring(url.indexOf("#") + 1);

  $('#' + hash).effect('highlight', {color: '#00f'}, 2000);
});

https://jsfiddle.net/jonathanzuniga/f6qohfb8/