2014-11-02 53 views
0

我正在努力從頁面獲取jsonp信息,並且希望在該信息上運行各種函數。信息恢復正常,但我似乎無法找到一種方法使其在功能之外訪問。我知道這是關閉和功能範圍,但我不知道如何使它的工作,任何想法?方法之外的變量內容

我可以通過對json文件進行多次調用來實現我想要在腳本的其餘部分做的事情,但我認爲最好只查詢json一次並將其彈出到變量中,然後嘗試關閉?我對這個設置比較陌生,所以有任何建議。

有效地從下面的代碼中,我希望能夠在getData方法運行之後獲得可訪問的allMatches變量。

感謝您的時間,所有幫助非常感謝。

var AppInfo = { 
    getData : function(){ 

       var responseJsonVar; 
       var callbackName, script, newInfo, mydata,allMatches; 
       // Get a random name for the callback 
       callbackName = "checkGames" + new Date().getTime() + Math.floor(Math.random() * 10000); 

       // create the jsonP script call on the page 
       script = document.createElement('script'); 
       script.src = "http://www.hookhockey.com/index.php/temp-gillian/?callback=" + callbackName; 
       document.documentElement.appendChild(script); 

       // call the json 
       window[callbackName] = function(data) { 

        responseJsonVar = data; // this is the info back from the json file 

        //the filtered data source from json 
        var allMatches = responseJsonVar["matches"]; 

        console.dir('allMatches inside the function: ' + allMatches); //this comes back fine 



         // Remove our callback ('delete' with 'window properties fails on some versions of IE, so we fall back to setting the property to 'undefined' if that happens) 
         try { 
          delete window[callbackName]; 
         } 
         catch (e) { 
          window[callbackName] = undefined; 
         } 

     //I've tried putting a return value (return allMatches) in here and then calling window[callbackName]() outside of the function but I get undefined for matches 

       }; // end window[callbackName] function 

    //this is what I think I should be doing to get the info out on its own 
    console.dir('allMatches OUTSIDE the function: ' + allMatches); //this doesn't come back 'allMatches is not defined' 


    } //end getdata method 

} //end AppInfo 


AppInfo.getData(); 

回答

1

當數據從JSONP電話回來你可以只創建名爲allMatchesAppInfo對象上的屬性並設置該屬性:

var AppInfo = { 
    allMatches: null, // NEW PROPERTY TO HOLD RETURNED DATA 
    confirmDataAvailableOutsideFunction: function() { // NEW FUNCTION TO VERIFY DATA AVAILABLE OUTSIDE getData() 
    console.dir('AppInfo.allMatches OUTSIDE the function AFTER jsonp call executes: ' + AppInfo.allMatches); //this doesn't come back 'allMatches is not defined' 
    }, 
    getData: function() { 

    var responseJsonVar; 
    var callbackName, script, newInfo, mydata, allMatches; 
    // Get a random name for the callback 
    callbackName = "checkGames" + new Date().getTime() + Math.floor(Math.random() * 10000); 

    // create the jsonP script call on the page 
    script = document.createElement('script'); 
    script.src = "http://www.hookhockey.com/index.php/temp-gillian/?callback=" + callbackName; 
    document.documentElement.appendChild(script); 

    // call the json 
    window[callbackName] = function (data) { 

     responseJsonVar = data; // this is the info back from the json file 

     //the filtered data source from json 
     AppInfo.allMatches = responseJsonVar["matches"]; // store data in allMatches property 

     console.dir('allMatches inside the function: ' + AppInfo.allMatches); //this comes back fine 
     AppInfo.confirmDataAvailableOutsideFunction(); // call test method to verify allMatches property is set 

     // Remove our callback ('delete' with 'window properties fails on some versions of IE, so we fall back to setting the property to 'undefined' if that happens) 
     try { 
     delete window[callbackName]; 
     } 
     catch (e) { 
     window[callbackName] = undefined; 
     } 

     //I've tried putting a return value (return allMatches) in here and then calling window[callbackName]() outside of the function but I get undefined for matches 

    }; // end window[callbackName] function 

    //this is what I think I should be doing to get the info out on its own 
    console.dir('AppInfo.allMatches OUTSIDE the function BEFORE jsonp call executes: ' + AppInfo.allMatches); //this doesn't come back 'allMatches is not defined' 


    } //end getdata method 

}; //end AppInfo 

AppInfo.getData(); 

請注意,我修改你的第二個console.dir的文字,以表明它在之前運行jsonp調用返回,因此allMatches屬性仍然是null在那一點上。

這就是爲什麼,實現@彼得-B的建議後使用window.allMatches而不是局部變量allMatcheswindow.allMatches外的函數是undefined - 您進行了檢查它,它被設置之前。

@ peter-b的解決方案可以正常工作,只要您在設置之前沒有嘗試訪問window.allMatches即可。所以如果你想要將數據存儲在一個全局變量中,你可以使用他的方法;如果你想讓它存儲在你的AppInfo對象上,你可以使用我的。

或者,也可以在具有allMatches作爲一個局部變量的直接功能包的一切:

(function() { 
    var allMatches = null; 

    var AppInfo = { 
    getData: function (dataReadyCallback) { 

     /* ... */ 
     allMatches = responseJsonVar["matches"]; 
     dataReadyCallback(); 
     /* ... */ 

    } 
    }; 

    AppInfo.getData(allMatchesReady); 

    function allMatchesReady() { 
    console.dir('allMatches OUTSIDE the function AFTER jsonp call executes: ' + allMatches); 
    } 

}()); 
+0

太好了,非常感謝您的信息,非常感謝! – 2014-11-04 20:43:19

+0

不客氣!很高興有幫助。 – MikeJ 2014-11-04 23:21:10

0

一個簡單的方法來得到你想要的是分配allMatcheswindow的屬性,使得它可以訪問無處不在。更換

var allMatches = responseJsonVar["matches"]; 

window.allMatches = responseJsonVar["matches"]; 

,再後來用window.allMatches訪問它。

+0

哎,感謝您的建議..我的建議,然後改變了我的控制檯登錄到控制檯取代。 log('allMatches OUTSIDE the function:'+ window.allMatches);但是恐怕我現在在控制檯中得到「allMatches OUTSIDE OUTSIDE:undefined」。 – 2014-11-02 22:15:51