-1

我想制作一个有多个页面的网站，但由于导航栏独特，我不能简单地链接到每个页面的新文件。实现这一目标的最佳方法是什么。我能想到的一些可能性是将它们全部放在一个页面上，但使用 css 和 javascript 将其他页面移出屏幕，或者使用 iframe 并使用 javascript 加载它们。有人可以指导我一些示例或教程吗？

4

2 回答 2

1

我认为您最好的选择是使用 iframe。

将每个 iframe 的 src 设置为要在小 div 中显示的页面。

这应该这样做

于 2012-11-25T04:56:20.543 回答
1

使用 jQuery 加载从导航中单击的页面。只需有一个包含分隔符 ( <div>)，页面将加载到该分隔符中。

这将加载页面而无需重新加载。

IFF（不是拼写错误，它的意思是“如果且仅当”）您想要支持未启用 Javascript 的浏览器，请使用 iFrame，但随后在您的 javascript 中将其从浏览器中删除，因为使用 iFrame 是非常糟糕的做法。

<script>
$(document).ready(function(){
 $("iframe").remove();
 $("body").append("<div id='page_container'></div>");
 $("#navigation_bar a").click(function(e){
  e.preventDefault();
  $("#page_container").load("http://www.example.com/"+this.attr("href"));
 });
});
</script>

HTML 看起来像：

<body>
 <nav>
  <a href="link1.html" target="frame">Link1</a>
  <a href="link2.html" target="frame">Link2</a>
 </nav>
 <iframe src="link1.html" name="frame"></iframe>
</body>

未经测试，但概念应该有效（http://jsfiddle.net/Ns2Gx/）

于 2012-11-25T05:40:47.617 回答