在jQuery中处理碎片哈希

Handling fragment hash in jQuery

本文关键字：碎片 哈希 处理 jQuery      更新时间：2023-09-26

我正在基于文本菜单中的单击事件填充一个名为content的div元素。这很好，但我想处理这些场景：

  1. 正在使用URL中的#片段刷新页面。目前，它导致一个空白的div
  2. 转到URL中没有#fragment的页面应该显示用blog.php填充div

提前感谢

代码

<!-- Transparent box -->
<div id="box">
<!-- Menu -->
<a href="#blog" onclick="$('#content').load('blog.php')">blog</a> |
<a href="#code" onclick="$('#content').load('code.php')">code</a> |
<a href="#portfolio" onclick="$('#content').load('portfolio.php')">portfolio</a> |
<a href="#about" onclick="$('#content').load('about.php')">about</a>
<div class="bar"></div>
<!-- Content -->
<div id="content"></div>
<div class="bar" id="footer"></div>
</div>

您可以通过多种方法解决。。也许是这样：

// Run on document ready
$(function() {
    // Get hash or set "#blog" as default
    var hash = document.location.hash || "#blog";
    // Trigger click event of anchor that has href as url hash
    $('[href="'+hash+'"]').click();
});
相关文章：