如何通过ajax调用从另一个目录同步加载脚本?

时间:2010-12-27 15:32:41

标签: javascript jquery ajax

我经常需要通过ajax加载其他javascript文件,所以在开始时我使用了jQuery提供的标准函数来加载脚本:

$.getScript('script_name.js',callback_function());

但这没有用,因为$ .getScript是异步的($ .ajax的jQuery API默认情况下'async'设置为true;主题在$ .getScript的API注释中讨论: http://api.jquery.com/jQuery.getScript/)。所以我编写了这个函数,由上面链接的API页面的注释中的某人提供:

load:function(script,callback){

    jQuery.ajax({

        async:false,

        type:'GET',

        url:script,

        data:null,

        success:callback,

        dataType:'script'

    });

},

这似乎运作良好,所以我继续,但我最近注意到,这只适用于同一目录中的脚本,例如。调用myObj.load('test.js')效果很好,但调用myObj.load('test / test.js')根本不起作用。

感觉我错过了一些明显的东西,但我没有设法找到问题。有什么想法吗?

2 个答案:

答案 0 :(得分:17)

默认情况下,您可以使用ajaxSetup将ajax调用设置为同步。这就是它的样子:

$.ajaxSetup({async:false});
$.getScript('script_name.js', callback_function);

如果您需要再次进行异步调用,只需启用它:

$.ajaxSetup({async:true});

答案 1 :(得分:13)

更新:请参阅下面的评论流,它与jQuery无关,这是服务器上的文件权限问题。


原始回答

您是否从浏览器中收到任何错误?例如,在Chrome或Safari中,如果您打开开发工具并查看控制台选项卡,它是否显示错误?或者在Firefox中,安装Firebug并检查Firebug的控制台。或者在IE中,使用免费版的VS.Net ......有些事情应该向你抱怨。

您还可以通过提供error功能而不是假设成功来从代码本身获取更多信息:

jQuery.ajax({
    async:false,
    type:'GET',
    url:script,
    data:null,
    success:callback,
    dataType:'script',
    error: function(xhr, textStatus, errorThrown) {
        // Look at the `textStatus` and/or `errorThrown` properties.
    }
});

更新:您已经说过textStatus ='错误'和errorThrown =未定义。很奇怪。如果移动它,那么相同的脚本是否有效,因此它不在子路径上?我想知道子路径是否是红色鲱鱼,真正的问题是脚本中的语法错误。


偏离主题真的是否必须同步?你不能只是轮询一个符号出现?只是同步ajax请求真正废弃用户体验。在许多浏览器中,不仅是您自己的页面,而且所有页面在请求期间锁定。

这就是我的意思:轮询:假设我想从JavaScript异步加载jQuery:

function loadScript(url, symbol, callback) {
    var script, expire;

    // Already there?
    if (window[symbol]) {
        setTimeout(function() {
            callback('already loaded');
        }, 0);
    }

    // Determine when to give up
    expire = new Date().getTime() + 20000; // 20 seconds

    // Load the script
    script = document.createElement('script');
    script.type = 'text/javascript';
    script.src = url;
    document.body.appendChild(script);

    // Start looking for the symbol to appear, yielding as
    // briefly as the browser will let us.
    setTimeout(lookForSymbol, 0);

    // Our symbol-checking function
    function lookForSymbol() {
        if (window[symbol]) {
            // There's the symbol, we're done
            callback('success');
        }
        else if (new Date().getTime() > expire) {
            // Timed out, tell the callback
            callback('timeout');
        }
        else {
            // Schedule the next check
            setTimeout(lookForSymbol, 100);
        }
    }
}

用法:

// Load jQuery:
loadScript("path/to/jquery.min.js", "jQuery", function(result) {
    // Look at 'result'
});