JQuery加载似乎没有处理?
我正在加载这样一个页面:
function loadGUIComponents() { // load contents into each accordion area $("#listEntryDiv").load("listEntry/listEntryIndex.html"); $("#openEntryDiv").load("openEntry/openEntryIndex.html"); };
在listEntryIndex.html中,可以正确调用这样的脚本:
alert("AHA!"); the world is helloed.
但是,如果我尝试将JS外部化为一个单独的文件:
the world is helloed.
永远不会调用该脚本。 我真的google了很多,我没有得到理由。 人们在问为什么他们的javascripts在加载后没有被调用,但是我的原因是只有标记在加载后才被调用。 谢谢!
这不是jQuery load
的问题,从根本上说是有效的: 实例这个例子是使用这个代码:
$("#target").load("http://jsbin.com/oqefe4");
要加载此文件:
Test
…参考这个:
alert("Hello");
(我在上面使用了完整路径,但是这里是一个带有相对路径的版本 ;也可以正常工作。)
这表明实际问题存在于其他地方。 你必须通过一个调试器来看看发生了什么。 幸运的是,几乎每个浏览器都有一个内置的设备,并且那些没有的浏览器有免费选项。
更新 :您可能遇到相对路径问题。 当HTML文件中的文本加载到当前文档中时,该HTML文本中script
(和img
等)标记内的路径将相对于当前文档的位置而不是您正在加载的文档的位置进行解析。 我在调试器中查找404错误,这可能是路径问题。 这个想法是由@Darth___(我认为还有更多)问题的一个现已删除的评论引发的,它质疑了这些路径……( 编辑 :这是DarthJDG;他现在发布了这个答案 。我打赌它是正确的那一个。)
所以具体来说,请说你的主要文件是
http://example.com/foo/maindocument.html
你的load
调用正在加载listEntry/listEntryIndex.html
和openEntry/openEntryIndex.html
,它们将是:
http://example.com/foo/listEntry/listEntryIndex.html http://example.com/foo/openEntry/openEntryIndex.html
如果其中的HTML具有您列出的脚本标记listEntryIndex.js
,它将相对于maindocument.html
, 而不是相对于listEntryIndex.html
,因此:
http://example.com/foo/listEntryIndex.js
不
http://example.com/foo/listEntry/listEntryIndex.js
您必须确保正确引用src属性中的脚本。 从上面的例子中,我假设当前的文件结构:
./currentPage.html ./listEntry/listEntryIndex.html ./listEntry/listEntryIndex.js ./listEntryIndex.js <------------ //This file doesn't exist.
当您从其他位置的文件加载内容时,可能找不到使用相对路径包含的脚本。 您应该复制脚本或符号链接它们以使它们可在本地访问或使用绝对路径。
试试这个 :
$.ajax({ url: "listEntry/listEntryIndex.html", dataType: "script", success: function(data){ $("#listEntryDiv").html(data); } }); $.ajax({ url: "openEntry/openEntryIndex.html", dataType: "script", success: function(data){ $("#openEntryDiv").html(data); } });
来自.load()文档 :
jQuery使用浏览器的.innerHTML属性来解析检索到的文档并将其插入到当前文档中。 在此过程中,浏览器通常会过滤文档中的元素,例如,或元素。 因此,.load()检索的元素可能与浏览器直接检索文档的元素不完全相同。
您是否可以在放置
标签并将浏览器剥离? 也许玩
标签放置。