在编写某个 跨域的 Ajax 调用 功能时,出现了个匪夷所思的问题,就是无法载入 iframe 中的连接器(YAHOO.util.Connect),代码和操作无任何的问题。

在麻烦了 圆心 同志 N 遍以后,发现原来是 iframe 没有完全载入,框架中的代码没有运行的缘故。(在这里再次感谢下他,Orz)

这的确是个非常普遍的问题,由于网速的缘故,往往父页面载入完成,而 iframe 中的内容还正在读取。这个时候,父页面调用子页面中的对象时,就会发生问题。

我想到了个变通的办法,就是「等待」子页面载入完成以后,再去尝试运行。如果子页面还没有载入相应的对象,那么就「再等待」一段时间再去尝试。

可能表述上有所欠缺,我们还是看具体的代码。

为了理解,首先说明已经在 HTML 中已经包含了此 iframe,并子页面中也包含了 YUI 的框架代码及相应的控件。

<iframe src="http://.../proxy.htm" id="proxy"></iframe>

下面是相应的 Javascript 代码

var proxy = $('proxy').contentWindow;
Controler.disable = true;  // 获取数据此段期间,禁止用户输入
if (typeof proxy.YAHOO == 'undefined') {
    // 等待一段时间再去尝试,Function 为父类的名称
    setTimeout(function() {Function.get(URL)}, 100); 
    return;
}

// 已经得到子页面对象,获取数据
proxy.YAHOO.util.Connect.asyncRequest('GET', URL, {
    success: function(req) {
        alert(req.responseText);
        Controler.disable = false; // 恢复用户输入
    },

    failure: function() {
        return false;
    }
});

不过这个代码还有很多的问题,目前所能预见到的,就是客户端的资源占用问题。可想而知,如果反复的请求数据对于浏览器来说,资源花销将是非常大的。

大家如果有更好的办法,不妨说说。