0

我已经被这段代码困住了几天，我想延迟 targetObj.innerHTML 的执行，直到所有的 javascript 文件都被加载（可能有多个，我实际上需要检查它们是否被加载而不是添加的标题），提前谢谢你们！

function addScriptTag(src) {
    var newScript;
    var loadFunc = function ()
    {
        $.holdReady(false);
    };
    newScript = document.createElement('script');
    newScript.setAttribute('type','text/javascript');
    newScript.setAttribute('src',src);

    //Other browsers trigger this one
    if (newScript.addEventListener)
    newScript.addEventListener('load', loadFunc, false);

    document.getElementsByTagName('head')[0].appendChild(newScript);
}

function parseScript(_source) {
    var source = _source;
    var scripts = source.match(/<script[^>]*src=[^>]*>/g);
    if (scripts) {
    for (var i = 0; i < scripts.length; i++) {
        src = scripts[i].match(/src=("([^"]*)"|'([^']*)')/);
        src = src[2] || src[3];
        if (src) {
            addScriptTag(src);
        }
    }
    }
    var scripts = new Array();

    return source;
}

function ajax_showContent(divId,ajaxIndex,url,callbackOnComplete)
{
        $.holdReady(true);
    var targetObj = document.getElementById(divId);
    targetObj.innerHTML = parseScript(dynamicContent_ajaxObjects[ajaxIndex].response);
4

2 回答 2

0

如果您想异步加载脚本依赖项，我会考虑使用像RequireJS这样的 AMD 库。它将检查所有脚本是否已加载，并允许您在回调中执行 yoru 代码。

于 2012-12-17T15:20:06.907 回答
0

这将是一些变化，但您可能正在查看的是递归 setTimeout 循环。代替设置，向该设置targetObj.innerHTML = ...发送回调。然后，在 中，有一个函数每 10 毫秒递归调用一次，使用.parseScripttargetObj.innerHTMLparseScriptwindow.setTimeout

每次调用此内部函数都会检查您的脚本是否已执行。（也许通过拥有一个保存要执行的脚本计数的全局变量，并从每个 addScriptTag > loadFunc 中减去。一旦达到 0，您就已经执行了所有脚本。）如果它们尚未执行，则函数只是在 window.setTimeout 内再次调用自己。如果有，则执行您的回调 - 将所需的值传回给它。

像这样的东西（未经测试）：

(function() {
    var scriptCount = 0;

    function addScriptTag(src) {
        var newScript;
        var loadFunc = function() {
            scriptCount--;
            $.holdReady(false);
        };
        newScript = document.createElement('script');
        newScript.setAttribute('type', 'text/javascript');
        newScript.setAttribute('src', src);

        //Other browsers trigger this one
        if (newScript.addEventListener) newScript.addEventListener('load', loadFunc, false);

        document.getElementsByTagName('head')[0].appendChild(newScript);
    }

    function parseScript(_source, callback) {
        var source = _source;
        var scripts = source.match(/<script[^>]*src=[^>]*>/g);
        if (scripts) {
            scriptCount = scripts.length;
            for (var i = 0; i < scripts.length; i++) {
                src = scripts[i].match(/src=("([^"]*)"|'([^']*)')/);
                src = src[2] || src[3];
                if (src) {
                    addScriptTag(src);
                }
            }
            var wait = function() {
                scriptCount > 0 ? window.setTimeout(wait, 10) : callback(source);
            };
        }
        else {
            callback("");
        }
        var scripts = new Array();

        return source;
    }



    function ajax_showContent(divId, ajaxIndex, url, callbackOnComplete) {
        $.holdReady(true);
        var targetObj = document.getElementById(divId);
        parseScript(
        dynamicContent_ajaxObjects[ajaxIndex].response, function(value) {
            targetObj.innerHTML = value;
        });
    }
})();

...但是，正如所指出的，还有像 require.js 这样的其他库可能会为您做这种事情。另外，我不确定source您是否真的想在这里返回，因此可能需要进行一些修改。

于 2012-12-17T15:34:53.727 回答