jQuery .load() 调用不会在加载的 HTML 文件中执行 JavaScript [英] jQuery .load() call doesn't execute JavaScript in loaded HTML file
问题描述
这似乎是仅与 Safari 相关的问题.我已经在 Mac 上尝试了 4 个，在 Windows 上尝试了 3 个，但仍然没有运气.
This seems to be a problem related to Safari only. I've tried 4 on Mac and 3 on Windows and am still having no luck.
我正在尝试加载外部 HTML 文件并执行嵌入的 JavaScript.
I'm trying to load an external HTML file and have the JavaScript that is embedded execute.
我尝试使用的代码是这样的:
The code I'm trying to use is this:
$("#myBtn").click(function() {
$("#myDiv").load("trackingCode.html");
});
trackingCode.html 看起来像这样(现在很简单，但会扩展一次/如果我能正常工作):
trackingCode.html looks like this (simple now, but will expand once/if I get this working):
<html>
<head>
<title>Tracking HTML File</title>
<script language="javascript" type="text/javascript">
alert("outside the jQuery ready");
$(function() {
alert("inside the jQuery ready");
});
</script>
</head>
<body>
</body>
</html>
我在 IE(6 和 7)和 Firefox(2 和 3)中都看到了警报消息.但是，我无法在 Safari 中看到消息(我需要关注的最后一个浏览器 - 项目要求 - 请不要发生冲突).
I'm seeing both alert messages in IE (6 & 7) and Firefox (2 & 3). However, I am not able to see the messages in Safari (the last browser that I need to be concerned with - project requirements - please no flame wars).
有没有想过为什么 Safari 会忽略 trackingCode.html 文件中的 JavaScript?
Any thoughts on why Safari is ignoring the JavaScript in the trackingCode.html file?
最终我希望能够将 JavaScript 对象传递给这个 trackingCode.html 文件，以便在 jQuery 就绪调用中使用，但我想确保这在所有情况下都是可能的在我走那条路之前浏览器.
Eventually I'd like to be able to pass JavaScript objects to this trackingCode.html file to be used within the jQuery ready call, but I'd like to make sure this is possible in all browsers before I go down that road.
推荐答案
您正在将整个 HTML 页面加载到您的 div 中，包括 html、head 和 body 标签.如果您执行加载并在加载的 HTML 中包含打开脚本、关闭脚本和 JavaScript 代码，会发生什么情况?
You are loading an entire HTML page into your div, including the html, head and body tags. What happens if you do the load and just have the opening script, closing script, and JavaScript code in the HTML that you load?
这里是驱动页面:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jQuery Load of Script</title>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("jquery", "1.3.2");
</script>
<script type="text/javascript">
$(document).ready(function(){
$("#myButton").click(function() {
$("#myDiv").load("trackingCode.html");
});
});
</script>
</head>
<body>
<button id="myButton">Click Me</button>
<div id="myDiv"></div>
</body>
</html>
这里是 trackingCode.html 的内容:
Here is the contents of trackingCode.html:
<script type="text/javascript">
alert("Outside the jQuery ready");
$(function() {
alert("Inside the jQuery ready");
});
</script>
这在 Safari 4 中对我有用.
This works for me in Safari 4.
更新:添加了 DOCTYPE 和 html 命名空间以匹配我测试环境中的代码.使用 Firefox 3.6.13 测试，示例代码有效.
Update: Added DOCTYPE and html namespace to match the code on my test environment. Tested with Firefox 3.6.13 and example code works.
这篇关于jQuery .load() 调用不会在加载的 HTML 文件中执行 JavaScript的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
