別のJSファイルからgoogle.setOnLoadCallback（）が機能しない

Question

私のウェブサイトでグラフを描画するためにGoogle APIを使用したいと考えています。しかし、私はgoogle.setOnLoadCallback関数に問題があります。ここに私のコードは（簡体字）である：

ATTEMPT 1：（ファインワークス）

<script type="text/javascript" src="https://www.google.com/jsapi"></script> 
<script type="text/javascript" src="js/styling.js"></script> 
<script type="text/javascript"> 

    // Load the Visualization API and the piechart package. 
    google.load('visualization', '1.0', {'packages':['corechart']}); 

    // Set a callback to run when the Google Visualization API is loaded. 
    google.setOnLoadCallback(helloWorld); 

    function helloWorld() { 
     alert("Hello World"); 
    } 

</script> 

ATTEMPT 2：（ファインワークス）

<script type="text/javascript" src="https://www.google.com/jsapi"></script> 
<script type="text/javascript" src="js/styling.js"></script> 
<script type="text/javascript"> 

    // Load the Visualization API and the piechart package. 
    google.load('visualization', '1.0', {'packages':['corechart']}); 

    // Set a callback to run when the Google Visualization API is loaded. 
    google.setOnLoadCallback(helloWorld); 

</script> 

と私が書くstyling.jsで：

function helloWorld() { 
    alert("Hello World"); 
} 

この場合、すべて正常に機能します。

しかし... ATTEMPT 3失敗し（！）

<script type="text/javascript" src="js/styling.js"></script> 

そして、私が書くstyling.js中：

window.onload = function() { 
    // Load the Visualization API and the piechart package. 
    google.load('visualization', '1.0', {'packages':['corechart']}); 

    // Set a callback to run when the Google Visualization API is loaded. 
    google.setOnLoadCallback(helloWorld); 
} 

function helloWorld() { 
    alert("Hello World"); 
} 

この1つは動作しません。 helloWorld()がまったく呼び出されていないようです。

なぜですか？

Answer 1

setOnLoadCallbackイベントは、ページがロードされたイベントが既にトリガーされているときにコールバックを定義しているため、まったくトリガーされないといいでしょう。

google.setOnLoadCallback(helloWorld);とfunction helloWorld() {...}は、ページがロードされたコールバックコンテキスト（両方ともそうでなければ、コンテキストの問題がある）の外側に置いてください。