jQuery加载另一个页面的内容答案

【问题标题】：Jquery load content of another pagejQuery加载另一个页面的内容
【发布时间】：2017-03-14 08:38:52
【问题描述】：

我试图从另一个页面加载内容，但是当我点击“获取内容”按钮时显示错误，这里是脚本>>

$(function(){
$('#get_contect').click(function(){
$('#contect').load('page.html #pageContect');
});
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<html>
<header>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</header>
<button type="button" id="get_contect">get contect</button>
<body>
<div id = "contect">
</div>
</body>

<footer>
</footer>
</html>

显示的错误是：

jquery-1.10.2.js:8706 XMLHttpRequest 无法加载 file:///C:/Users/khaled%20salem/Desktop/New%20folder/page.html。叉源请求仅支持协议方案：http、data、 chrome, chrome-extension, https, chrome-extension-resource.

【问题讨论】：

您通过file:/// 协议运行您的代码
stackoverflow.com/questions/20041656/…
您是否在您请求的资源上启用了 CORS 标头“Access-Control-Allow-Origin”？
哎呀它没有启用
@KhaledALHajSalem 查看第一条评论

标签： jquery html

【解决方案1】：

为了加载页面，加载的文件需要位于同一域中，这可以通过使用以下应用之一在本地托管您的网站来完成：

您将不需要启用 CORS，因为请求的文件来自同一个域，即来自本地主机（或部署时您的托管网站）。

配置主机后，将请求的 URL 更改为以下内容：

$('#contect').load('page.html#pageContect');

这意味着该页面与您的当前页面位于同一文件夹中，并且#pageContect 元素将在加载后显示 - 两者之间不得有空格。

如果您在另一个文件夹中有页面，您可以通过在开头输入尾部斜杠来使用网站目录的绝对路径（即$('#contect').load('/path/to/file/page.html#pageContect');，或者通过提供来自文件位置的相对路径，使用@ 987654327@上目录。

【讨论】：