0

这是我正在使用的代码:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org        /TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Menu</title>
<link rel="stylesheet" type="text/css" href="css/estilo.css">

</head>

<body>
<script src="script/jquery.js"></script>
<script>
$( document ).ready(function() {



$("#a").click(function(){
   $("#content").load('index.html');
});


});
</script>
<nav>
  <ul>
    <li id="a">
     <a href="">Primero</a>
 </li>
 <li>
    <a href="">Segundo</a>   
 </li>
 <li>
    <a href="">Tercero</a>
 </li>
  </ul>
</nav>
<div id="content">

</div>
</body>
</html>

我尝试在 div 'content' 上加载这个 html 页面:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org    /TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Menu</title>
</head>

<body>
<nav>
<embed src="">

 </embed>
</nav>

INDEX
</body>
</html>

但它只加载不到一秒钟。这是为什么?我认为它应该持续超过几分之一秒。我希望它在加载后会保持稳定。

我的目标是使用这种技术在网站中加载 html 页面,使用带有菜单和标题、页脚和基本信息的参考页面,这些页面应该随时显示在整个网站中。像这样,如果我不得不更改整个网站的页脚或标题上的某些文本,我只需要访问这个主要的 html,而不必更改我网站所有页面中的所有代码,那将是相当不错的一项乏味且不舒适的工作。

所有这些努力都准备在没有 apache 的服务器上运行网站。

4

1 回答 1

2

空的 href 将重新加载页面,并且使用 javascript 所做的任何更改都将消失。

要么改变锚点:

<a href="#">Primero</a>

但这会将页面滚动到顶部,这可能是一个问题

或者,阻止锚点的默认操作:

$("#a").click(function(e){
   e.preventDefault();
   $("#content").load('index.html');
});
于 2013-11-01T23:54:05.143 回答