gpt4 book ai didi

jQuery 加载问题

转载 作者:行者123 更新时间:2023-12-01 06:30:07 25 4
gpt4 key购买 nike

对 jQuery 还很陌生,需要以下方面的帮助:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery demo</title>
</head>
<body>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>

<script type="text/javascript">
$(document).ready(function() {
$('.nav-link').click( function() {
var href = $(this).attr('href');
$('#content').load( href, function() {
alert("Yeahhhh !");
});
return false; // don't actually follow the link
});
});
</script>

<div class="menu">
<ul>
<li><a href="http://www.google.com.my/" class="nav-link"> Yeah 1 </a></li>
<li><a href="C:\Testing\Yeah1.html" class="nav-link"> Yeah 2 </a></li>
</ul>
</div>


<div id="content">
... Initial Content...
</div>
</body>
</html>

我创建了这个名为testing.html 的HTML 文件,并创建了另一个名为yeah1.html 的简单HTML 文件用于测试目的。在放置 jQuery 代码之前,可以将链接定向到yeah1.html。

但是,在放置 jQuery 代码后, $('#content').load( href); 应该能够加载其 DIV 中的内容,我什至收到了消息“是啊啊!”的警报...但是,内容仍然没有加载。

最佳答案

出于安全原因,许多浏览器(Chrome、FF)会阻止直接从磁盘加载文件。

当您使用C:\...引用文件时,协议(protocol)为file。链接最终如下所示:

<a href="file:///C:\Testing\Yeah1.html" class="nav-link"> Yeah 2 </a>

要修复此问题,请将 Yeah1.html 文件放入网站的虚拟文件夹中,并使用绝对或相对路径通过 http 协议(protocol)加载它。

(相对路径)

<a href="Yeah1.html" class="nav-link"> Yeah 2 </a>

或(绝对路径)

<a href="/Yeah1.html" class="nav-link"> Yeah 2 </a>

或(绝对路径,完全指定)

<a href="http://mysite.com/Yeah1.html" class="nav-link"> Yeah 2 </a>

然后是 Dennis提到,由于违反同源策略,您的情况下加载失败。因此,您可以加载 Yeah1,html,但调用 google.com 将失败,除非您切换到 jsonp

function jsonpCallback(data, status) {
alert("data: " + data + ", status: " + status);
}

$.ajax({
url: "http://www.google.com.my/",
dataType: 'jsonp',
jsonpCallback: 'jsonpCallback',
});

关于jQuery 加载问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7178216/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com