页面无法执行 $("#..").load()

Posted 2023-02-27

【中文标题】页面无法执行 $("#..").load()

【英文标题】：Page Unable to execute a $("#..").load()

【发布时间】：2016-03-19 11:20:30

【问题描述】：

功能：

当用户点击图像按钮时，假设将用户从当前页面带到下一页。

做了什么：

我使用了 jQuery 方法调用：.load(url)，因此语法类似于：$("#divID").load("***.html");

问题：

当我点击图片按钮时，它给出了以下错误消息：

XMLHttpRequest 无法加载 jquery-1.11.3.min.js:5 文件：///Users/trinax/Documents/Ernest/Project/ToysRUs/ToyRUs(main)/TapAStar.html。跨源请求仅支持协议方案：http、data、chrome、chrome-extension、https、chrome-extension-resource。

此外，结果页面是空白的，不显示任何内容。

出了什么问题？请帮忙

$("#tapButton").click(function() 
  // Enter Link here (Tap A Star Game)
  $("#load_tapGame").load("Tap.html");

  $("#menu").fadeOut(function() 
    $("#load_tapGame").fadeIn();
  )
)

<div id="load_tapGame"></div>
<div id="menu">
  <img style="position: absolute; top: 2150px; left: 185px; z-index: 2" src="library/image/tapAStarButtonCloud.png" />
  <div class="button">
    <button id="tapButton" class="buttonProperty">
      <img src="library/image/tapButton.png" />
    </button>
  </div>
</div>

【问题讨论】：

这对你有帮助。 ***.com/questions/15005500/…

@BhojendraNepal 谢谢！！我想知道如果我使用：location.href="***.html"; 是否更合适？

在提供的链接中仔细查看答案。

【参考方案1】：

您需要使用服务器。由于 CORS，在本地工作时尝试使用 javascript 加载内容将失败。 https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS

我喜欢使用 Live Server 进行本地测试。您可以在此处找到有关如何使用 npm 安装它的说明：https://github.com/tapio/live-server

您可以在此处找到有关安装 npm（节点包管理器）的说明：https://nodejs.org/en/download/