我已经阅读了几篇关于这个问题的帖子,但我无法解决它。
我正在将一个 html 文件加载到一个 div 中。我正在加载的文件包含一个无序列表。此列表应展开(带有子菜单项的菜单)并关闭。因此我需要js。但不幸的是,这个脚本没有加载。
谁能帮我?
会太棒了!非常感谢 :)
我已经阅读了几篇关于这个问题的帖子,但我无法解决它。
我正在将一个 html 文件加载到一个 div 中。我正在加载的文件包含一个无序列表。此列表应展开(带有子菜单项的菜单)并关闭。因此我需要js。但不幸的是,这个脚本没有加载。
谁能帮我?
会太棒了!非常感谢 :)
您想通过 AJAX 加载到页面上的 div 中,让我们调用它;
1) <div id="loadStuffHere"></div>
(abc.html)
2)要填充的东西loadStuffHere
来自xyz.html
所以就这样做;
$("loadStuffHere").load("xyz.html");
可是等等!!您不想从 xyz.html 加载所有内容,您只想加载 xyz.html 的一部分,比如<div id="loadMeOnly"></div>
(xyz.html)
所以就这样做;
$("loadStuffHere").load("xyz.html #loadMeOnly");
可是等等!!让我们说里面<div id="loadMeOnly"></div>
是一个手风琴,所以这意味着它必须被初始化,这意味着你还必须包括 javascripts...嗯,该怎么做...
你会想到这样做;
$("loadStuffHere").load("xyz.html #loadMeOnly");
$.getScript('js/xyz.js');
嗯,上面很糟糕,因为 a) 你需要创建一个外部 js 文件和 b) 你实际上是在进行 2 个 http 调用,如果你通过正常的非 ajax 方式进行,你可以用 1 个 http 调用来完成。
最好的解决方案是通过 1 次调用获得 2 件事(HTML 和 js - 1 行,1 个 http),这就是你如何做到的;
$("loadStuffHere").load("xyz.html #loadMeOnly, script");
这将加载#loadMeOnly
div 和所有script
标签
这里的诀窍是逗号。你可以选择加载任何你想要的doms
所以让我们首先确保你已经加载了 jQuery,确保库的链接在你的 HTML 的头部,所以像这样:
<script src="/javascripts/jquery-1.3.2.min.js" type="text/javascript"></script>
使用firebug通过检查“net”选项卡来确保它已加载。
还要确保您正在加载您的javascript:(这里我称之为“主要”)
<script src="/javascripts/main.js" type="text/javascript"></script>
然后在您的 js 文件中执行以下操作:
$.(document).load( function () {
alert("loaded!")
});
一旦页面“完全加载”我更喜欢使用ready()
它会在加载 DOM 后触发警报。
如果您已经完成了所有工作,并且您真正想要做的是从您的 js 文件加载和执行 js,请尝试以下操作:
.getScript()
这将加载并执行您想要的 JavaScript。
此解决方案效果最佳。在加载特定 div 或内容容器后使用回调函数。
$('#CONTAINER').load('URL_TO_LOAD HTML_ELEMENT_TO_PLUCK_FROM_PAGE_AND_INSERT_INTO_CONTAINER', function () {
$.getScript('PATH_TO_SCRIPT_THAT_YOU_REQUIRE_FOR_LOADED_CONTENT');
});
巨虎。我已经解决了。不知道这是否是最优雅的方式,但它有效:)
jpsilvashy 你的 getscript(); 已经完成了 :) 我已经在应该加载的内容中包含了这两行:
<script type="text/javascript">
$.getScript("js/tutorial-1.js");
$.getScript("js/jquery.ahover.js");
</script>
这样可行。
对于有同样问题的每个人,都有一个小提示。您应该删除 body 和 head 标签。如果包含它们,则不起作用。
但是现在还有一个问题:为什么我需要在加载的内容中包含这个?我认为必须在内容加载到 dom 后加载 JavaScript。
但这只是一些假设!
感谢您的大力帮助!
脚本不能使用document.ready,文档已经准备好了。只需将脚本放在脚本标签之间。
错误的:
<script type="text/javascript">
$(document).ready(function() {
alert($('div').html());
});
</script>
正确的:
<script type="text/javascript">
alert($('div').html());
</script>