JavaScript在A頁面判斷B頁面加載完畢（iframe load）

今天遇到一個需求，在A頁面上判斷Ｂ頁面是否加載完畢（Ｂ頁面是第三方頁面），加載完畢時隱藏loading動畫。。。

而平時我們一般做的事是在Ｂ頁面上判斷Ｂ頁面是否加載完畢，進行操作。

if(document.readyState == 'Loaded'){
    // 我們的操作
    //頁面加載readyState的五種狀態 原文如下:
    //0: (Uninitialized) the send( ) method has not yet been invoked.
    //0 － （未初始化）還沒有調用send()方法
    //
    //1: (Loading) the send( ) method has been invoked, request in progress.
    //1 － （載入）已調用send()方法，正在發送請求
    //2: (Loaded) the send( ) method has completed, entire response received.
    //2 － （載入完成）send()方法執行完成，已經接收到全部響應內容
    //3: (Interactive) the response is being parsed. 4: (Completed) the response has been parsed, is ready for harvesting.
    //3 － （交互）正在解析響應內容
    //
    //4: (Completed) the response has been parsed, is ready for harvesting.
    //4 － （完成）響應內容解析完成，可以在客戶端調用了
}。

　那么在Ａ頁面做Ｂ頁面（新頁面）的加載判斷，據我所知，這是做不到（也許是我不知道有其他更高明的方法），隨采用了iframe的方式去做。在Ｂ頁面嵌套在Ａ頁面里，就可以做了。
ＰＳ：一些框架，如ＮＧ，ＳＵＩ等里面貌似可以做（我沒有去嘗試，為了一個loading引入一個大框架，血虧啊）。
話不多說，主要代碼如下，
完整ｄｅｍｏ下載地址：https://pan.baidu.com/s/1o8yJLm6(包括了loading)
主要代碼： 
ＨＴＭＬ：

<iframe id="frame" frameborder="0" src="">
</iframe>

ＪＳ：

iframe_load: function () {

//兼容IE７－８

    if ($('#frame')[0].attachEvent) {
        $('#frame')[0].attachEvent('onload', function () {
            $('#frame').show();
            $('#loading').hide();
        })
    } else {
        $('#frame')[0].onload = function () {
            $('#loading').hide();
            $('#frame').show();
        }
    }
},
ＣＳＳ：

#frame{
    height: 100%;
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
}

本身ＪＱ也有ｌｏａｄ，但是本人沒用成功，一直報錯，報錯ＪＱ的東西。
試過＄．ｌｏａｄ（），但是遇到跨域問題。