2016-08-14 55 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'。如果我是正確的,在一些(較老的?)瀏覽器上,如果腳本緩存了,否則load事件不會被觸發。 –

+0

@ A.Wolff還沒有聽說過這樣的行爲。 :)但是,以防萬一... –

+0

@YuryTarabanko這工作。非常感謝:D – MaazKhan47