Question

当点击导航链接时，我正在尝试使用jQuery更改主页的主要内容区域。我正在使用.load（）来执行此操作，但我正在引用的外部html页面不会加载（没有任何反应）。

custom.js

$(document).ready(function(){
  $("#about").click(function(event){
    event.preventDefault();
      $(".main-content").fadeToggle("slow", function(){
        $(this).load("about-us.html")
      });
   });
});

的index.html

<div class="inner cover main-content">
  <h1 class="cover-heading">A heading</h1>
  <p class="lead">This is the best page of all time.</p>
</div>

Answer 1

想想我会回答我自己的问题，因为需要花费数小时才能找到一些如此微不足道的东西。

如果您在本地加载jQuery，则必须使用本地Web服务器（如MAMP）运行该文件，而不是仅仅“单击”它（例如，在浏览器中加载文件）。

如果没有从某种Web服务器提供外部文件，jQuery将不会加载外部文件。

如果您检查控制台，则会看到类似以下内容的错误：

MLHttpRequest cannot load file:///Users/yourname/filepath/index.html. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.

jQuery不会使用.load（）加载外部html模板

1 个答案: