jQuery加载另一个页面的内容
Posted
技术标签:
【中文标题】jQuery加载另一个页面的内容【英文标题】：Jquery load content of another page 【发布时间】：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:/// 协议运行您的代码
***.com/questions/20041656/…
您是否在您请求的资源上启用了 CORS 标头“Access-Control-Allow-Origin”？
哎呀它没有启用
@KhaledALHajSalem 查看第一条评论
【参考方案1】：
为了加载页面，加载的文件需要位于同一域中，这可以通过使用以下应用之一在本地托管您的网站来完成：
MAMP: easy to configure, available for Windows and Mac OS X XAMPP: more advanced, available for Windows, OS X and Linux WAMP: in the mid of the two, but not very user-friendly and available only for Windows您将不需要启用 CORS，因为请求的文件来自同一个域，即来自本地主机（或部署时您的托管网站）。
配置主机后，将请求的 URL 更改为以下内容：
$('#contect').load('page.html#pageContect');
这意味着该页面与您的当前页面位于同一文件夹中，并且#pageContect 元素将在加载后显示 - 两者之间不得有空格。
如果您在另一个文件夹中有页面，您可以通过在开头输入尾部斜杠来使用网站目录的绝对路径（即$('#contect').load('/path/to/file/page.html#pageContect');，或者通过提供来自文件位置的相对路径，使用@ 987654327@上目录。
【讨论】：
以上是关于jQuery加载另一个页面的内容的主要内容，如果未能解决你的问题，请参考以下文章
如何使用 JQuery 重定向，加载另一个页面但在请求中发送了一些 POST 参数？
JQuery ajax操作，怎么让页面首次加载时就呈现所有数据
Jquery Mobile：“pageshow”事件仅在 Shift F5（完全重新加载）时触发，但在加载另一个页面或具有不同查询的同一页面时不会触发