2016-08-14 4 views
0

別のタブでハイチャートを作成しようとしています。しかし、高いチャートが定義されていないというエラーが出ています。私はさまざまな方法でHighchart.jsを登録しようとしました。コードを以下に示します。document.createElement( 'script')に 'src'属性を設定しますか?

function OpenWin() { 
    var w = window.open(); 
    w.document.open(); 
    w.document.write('<div id="container" style="width:100%; height:400px;"></div>'); 

    var scriptHead = w.document.createElement("SCRIPT"); 
    //scriptHead.setAttribute('src','http://code.highcharts.com/highcharts.js'); 
    var link = "http://code.highcharts.com/highcharts.js"; 
    scriptHead.src = link; 
    w.document.head.appendChild(scriptHead); 

    var script = w.document.createElement("SCRIPT"); 
    w.document.body.appendChild(script); 
    var js = w.document.createTextNode('var a = localStorage.getItem("ImportOptions"); console.log(JSON.parse(a)); var chart = new Highcharts.Chart(JSON.parse(a))'); 
    script.appendChild(js); 
    w.document.close();  
} 
+0

おそらくスクリプトのロードイベントを使用して、ロジックを定義する必要があります。私はあなたがそれを追加していると思います、 'scriptHead'は非同期です。ですから、以下のロジックを 'scriptHead.onload = function(){var script = w.document.createElement(" SCRIPT "); /*...*/}; ' –

答えて

4

前のスクリプトが読み込まれるのを待つ必要があります。 Demo

function OpenWin() { 
    var w = window.open(); 
    w.document.open(); 
    w.document.write('<div id="container" style="width:100%; height:400px;"></div>'); 

    var scriptHead = w.document.createElement("SCRIPT"); 
    //scriptHead.setAttribute('src','http://code.highcharts.com/highcharts.js'); 
    var link = "http://code.highcharts.com/highcharts.js"; 

    // bind on script load event 
    scriptHead.onload = function() { 
     var script = w.document.createElement("SCRIPT"); 
     w.document.body.appendChild(script); 
     var js = w.document.createTextNode('var a = localStorage.getItem("ImportOptions"); console.log(JSON.parse(a)); var chart = new Highcharts.Chart(JSON.parse(a))'); 
     script.appendChild(js); 
     w.document.close();   
    } 

    // as A.Wolff mentioned you might need to set onload befor src for some browsers. 
    scriptHead.src = link; 
    w.document.head.appendChild(scriptHead); 
} 
+0

しかし、私は' scriptHead.onload'を定義した後に 'scriptHead.src'を設定します。私が正しい場合、一部の(古い?)ブラウザでは、スクリプトがキャッシュされていれば、ロードイベントは発生しません。 –

+0

@A.Wolffこのような動作について聞いたことがありません。 :)しかし、ちょうどの場合... –

+0

@YuryTarabankoこれは働いた。ありがとうalot:D – MaazKhan47

関連する問題