javascript - 在 jQuery 中处理片段哈希

Question

我正在根据文本菜单中的单击事件填充一个名为 content 的 div 元素。这工作正常，但我想处理这些情况：

1. URL 中带有 # 片段的刷新页面。目前，它会导致一个空白的 div。
2. 转到 URL 中没有 # 片段的页面应该显示用 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>

Answer 1

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

// 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();
});