Javascript “错误”；目标函数'；模态'；“没有办法”；使用动态加载的脚本文件

从主体内的脚本中，我将jquery和SimpleModel动态加载到页面标题中。在调用jQuery之前，我使用callback来确保jQuery已完全加载——这很有效。但是，当我动态加载SimpleModel脚本文件时，我无法随后调用它的方法。当SimpleModel脚本延迟加载时，如果无法引用当前文档对象，则会出现此错误。任何帮助都将不胜感激

/******** Called once jQuery has loaded ******/
function scriptLoadHandler() {
    jQuery = window.jQuery.noConflict(true);

    main();
}

/******** Main function ********/
function main() {
    jQuery(document).ready(function ($) {
        var domain = 'http://qo.microssoftware.com';

        /******* Load SimpleModal *******/
        var script_tag = document.createElement('script');
        script_tag.setAttribute("type", "text/javascript");
        script_tag.setAttribute("src",
        domain + "/js/simplemodal.js");
        script_tag.onload = modalLoadHandler;
        (document.getElementsByTagName("head")[0] || document.documentElement).appendChild(script_tag);

    });
}

function modalLoadHandler() {
    /******* Open Modal *******/
    $.modal("<div><h1>SimpleModal</h1></div>", {});
}

加载jQuery后调用

/*************/
函数scriptLoadHandler（）{
jQuery=window.jQuery.noConflict（true）；
main（）；
}
/********主要功能********/
函数main（）{
jQuery（文档）.ready（函数（$）{
var域http://qo.microssoftware.com';
/*******加载SimpleModal*******/
var script_tag=document.createElement（'script'）；
script_tag.setAttribute（“type”、“text/javascript”）；
script_tag.setAttribute（“src”，
domain+“/js/simplemodal.js”）；
script_tag.onload=modalLoadHandler；
（document.getElementsByTagName（“head”）[0]| | document.documentElement）.appendChild（script_标记）；
});
}
函数modalLoadHandler（）{
/*******开放模态*******/
$.modal（“SimpleModal”，{}）；
}

首先，我认为这是不必要的。SimpleModel脚本非常紧凑。更多地考虑如何优化一般的脚本加载（gzip，或者如果必须使用ajax、AMD依赖项加载和RequireJS等），而不需要这种ajax方法带来不必要的复杂性

---

使用这种方法的脚本加载器（如facebooksdk或googlemaps）将在初始化脚本后搜索window（全局）元素以调用回调。基本上，您必须修改SimpleModel代码，然后将依赖代码包装到回调中。我几乎看不出在这种情况下有什么必要。首先，我认为这是不必要的。SimpleModel脚本非常紧凑。更多地考虑如何优化一般的脚本加载（gzip，或者如果必须使用ajax、AMD依赖项加载和RequireJS等），而不需要这种ajax方法带来不必要的复杂性

使用这种方法的脚本加载器（如facebooksdk或googlemaps）将在初始化脚本后搜索window（全局）元素以调用回调。基本上，您必须修改SimpleModel代码，然后将依赖代码包装到回调中。我几乎看不出在这种情况下有什么必要这样做。

试试：

<script type="text/javascript" src="http://qo.microssoftware.com/js/simplemodal.js"></script>
<script type="text/javascript">
jQuery(document).ready(function ($) {
    $.modal("<div><h1>SimpleModal</h1></div>");
});
</script>

jQuery（文档）.ready（函数（$）{
$.modal（“SimpleModal”）；
});

或者，如果要使用main（）函数调用模态：

<script type="text/javascript" src="http://qo.microssoftware.com/js/simplemodal.js"></script>
<script type="text/javascript">
jQuery(document).ready(function ($) {
    function main() {
        $.modal("<div><h1>SimpleModal</h1></div>");
    }
});
</script>

jQuery（文档）.ready（函数（$）{
函数main（）{
$.modal（“SimpleModal”）；
}
});

你不需要把js放在标题中。。。事实上，有些程序员总是把所有的JS放在结尾的BODY标签前面。

试试：

<script type="text/javascript" src="http://qo.microssoftware.com/js/simplemodal.js"></script>
<script type="text/javascript">
jQuery(document).ready(function ($) {
    $.modal("<div><h1>SimpleModal</h1></div>");
});
</script>

jQuery（文档）.ready（函数（$）{
$.modal（“SimpleModal”）；
});

或者，如果要使用main（）函数调用模态：

<script type="text/javascript" src="http://qo.microssoftware.com/js/simplemodal.js"></script>
<script type="text/javascript">
jQuery(document).ready(function ($) {
    function main() {
        $.modal("<div><h1>SimpleModal</h1></div>");
    }
});
</script>

jQuery（文档）.ready（函数（$）{
函数main（）{
$.modal（“SimpleModal”）；
}
});

---

你不需要把js放在标题中。。。实际上，一些程序员总是将他们所有的JS放在结束BODY标记之前。

这是您希望基于脚本的

onload

事件创建异步闭包的地方

如果必须支持古老的IE，还可以挂接到

onreadystatechange

事件中，就像在AJAX请求中（纯JS中）那样。 更现代的浏览器不会触发此事件

因此，将onload转换为回调，从文件中激发已知方法。

---

您还可以通过附加到脚本加载的

onerror

来绕过错误。

这是您希望基于脚本的

onload

事件创建异步闭包的地方

如果必须支持古老的IE，还可以挂接到

onreadystatechange

事件中，就像在AJAX请求中（纯JS中）那样。 更现代的浏览器不会触发此事件

因此，将onload转换为回调，从文件中激发已知方法。

---

您还可以通过附加到脚本加载的

onerror

来绕过错误。

事实上，我认为这不起作用。他的依赖项不是DOM，而是异步加载的脚本。@Squirkle好的，我明白你的意思了。。。也许他需要详细说明一下这个问题……事实上，仔细观察后，你的例子非常好。他只需要标签。我希望用户将远程javascript的链接粘贴到页面主体中，它将弹出模式。模式内容是从远程服务器动态提供的。这就是我动态加载jQuery（根据需要）和SimpleModel的原因。看起来我的代码在DOM加载完成后执行，但是SimpleModel脚本仍在加载或不可访问。@user965614但是为什么不将SimpleModel与DOM一起加载，然后动态调整内容呢？对我来说，通常通过减少动态负载使其尽可能紧凑来保持简单。实际上我不相信这会起作用。他的依赖项不是DOM，而是异步加载的脚本。@Squirkle好的，我明白你的意思了。。。也许他需要详细说明一下这个问题……事实上，仔细观察后，你的例子非常好。他只需要标签。我希望用户将远程javascript的链接粘贴到页面主体中，它将弹出模式。模式内容是从远程服务器动态提供的。这就是我动态加载jQuery（根据需要）和SimpleModel的原因。看起来我的代码在DOM加载完成后执行，但是Simp