Question

我有一个链接到本地网页的菜单栏，工作正常，但是当我点击菜单栏上的链接时，它会转到有问题的网页，留下带有菜单栏的网页，但我希望加载下面的页面菜单栏这样用户可以使用菜单栏进行导航。我应该使用iframe吗？抱歉，在很长一段时间内都没有使用过HMTL5，非常感谢。

尼尔。

<div class="menu">
        <a href="home.hmtl">Home</a>
        <a href="index.html">Index of Services</a>
        <a href="schedule.html">Schedule</a>
        <a href="examples.hmtl">Examples</a>
     </div>
    <div class="content">

    This page is to help you organise

</div>

Answer 1

是的，你需要框架。或者，最常见的是，在所有html上都有相同的菜单代码，因为使用框架，除非你做一些技巧，否则你的网址不会改变。

如果您不想复制代码，可以使用PHP。然后，您可以使用菜单创建一个index.php，并使用包含到页面内容。

编辑：
您也可以使用一些JavaScript来完成它，但它也与URL有相同的问题。如果禁用JavaScript，该网站也将无效。

EDIT2：我之前说的框架和javascript的技巧可以在没有url重写的情况下实现，并且使用纯HTML + CSS + JS可以使用锚点。

基本上，您将网址更改为具有网页名称的网址，并在首次加载网页时检查此哈希，以便在有人输入您的网址http://mypage.com/#examples时打开正确的框架。您可以使用window.location.hash访问和设置哈希值。

所以你的代码看起来像是：

<div class="menu">
    <a href="#home">Home</a>
    <a href="#index">Index of Services</a>
    <a href="#schedule">Schedule</a>
    <a href="#examples">Examples</a>
</div>
<div class="content">
    This page is to help you organise
</div>

无论是否有框架，您都需要在每个菜单项上附加一个JavaScript事件。

使用框架时，JS基本上会在用户点击菜单时更改框架网址。

没有框架，您可以使用xhr下载html，然后，如果您成功下载了html，则会删除div.content中的所有内容，并将其替换为您使用innerHtml下载的内容。< / p>

对于这两种解决方案，您需要添加一个JS，在第一次加载页面时检查哈希，以相应地更新显示的页面。

对于PHP或其他服务器端“脚本”，任何初学者教程都会解释如何操作。

菜单栏上的HTML5链接离开当前页面

1 个答案: