Question

我使用jQuery脚本加载nav.html和footer.html。我的问题是，当我在Wamp测试我的网站时，它很好。当我将它加载到我的真实网络服务器时，它不会加载我的徽标。我无法弄清楚为什么，我找不到任何东西。

这是我的nav.html

<meta content="text/html;charset=utf-8" http-equiv="Content-Type">
<meta content="utf-8" http-equiv="encoding">
<html>
 <head>
  <title></title>
  <link rel="stylesheet" type="text/css" href="style.css" async>
 </head>
 <body border="1" style="hight:60, border-bottom: 5px solid cyan; vertical-align: middle;">
  <br>
  <img src="attf.png" width="256px">
  <a id="button" href="index.html">Home</a>
  <a id="button" href="gameserv.html">Game Servers</a>
  <a id="button" href="comsserv.html">Communication Servers</a>
  <br>
  <br>
 </body>
</html>

以下是我将nav.html加载到我的网页中的方式。

<head>
 <title></title>
 <link rel="stylesheet" type="text/css" href="style.css" async>
 <script src="//code.jquery.com/jquery-1.10.2.js"></script>
 <script>
  $(function(){
   $("#nav").load("nav.html");
   $("#footer").load("footer.html");
  });
 </script>
</head>
<body border="1">
 <div id="nav"></div>
 <div id="footer"></div>
</body>

如果有帮助您可以在http://attf.us/找到我的网站。

Answer 1

您正在<div>。

中加载完整的HTML页面

nav.html不应包含<html>，<head>和<body>标记。这在<div>代码中不正确。

将其更改为：

<link rel="stylesheet" type="text/css" href="style.css" async>
<div border="1" style="hight:60, border-bottom: 5px solid cyan; vertical-align: middle;">
 <br>
 <img src="attf.png" width="256px">
 <a id="button" href="index.html">Home</a>
 <a id="button" href="gameserv.html">Game Servers</a>
 <a id="button" href="comsserv.html">Communication Servers</a>
 <br>
 <br>
</div>

对于样式表，您可能希望查看不同的内容以将<link>标记放在<head>中，但它可能在内联工作。另一种方法是为您的CSS使用<style>标记，但这会使其100％内联，这可能不是您想要的。

Answer 2

感谢Alexis提供更好的建筑习惯信息。此外，geedubbs和rupps指出它可能是一条糟糕的道路或其他类似的问题。

我发现我的网络服务器区分大小写。

谢谢你们，这让我在圈子里跑了大约一个小时。

无法使用带有加载功能的jQuery脚本加载图像

2 个答案: