加載Highcharts

我試圖加載圖表中的IFRAME（使用Highcharts），我加載highcharts但控制檯返回$（...）。highcharts不是一個函數加載Highcharts

$('<iframe id="panel_frame_container" frameborder="0"/>').load(function(){ 
      $('#panel_frame_container').contents().find('body').append("<div id='panel_chart_container'></div>").end() 
                .find('body').append('<script src="//ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"><\/script>').end() 
                .find('body').append('<script src="https://code.highcharts.com/highcharts.js"><\/script>').end() 
                .find('body').append('<script src="https://code.highcharts.com/highcharts-more.js"><\/script>').end() 
                .find('body').append('<script src="https://code.highcharts.com/modules/exporting.js"><\/script>').end() 
                .find('body').append("<script type='text/javascript'>$(document).ready(function(){console.log('loaded');$('#panel_chart_container').highcharts("+data2+");});<\/script>"); 
     }).appendTo($(".panel-body"));

https://jsfiddle.net/s82v657e/

我的目標是讓用戶設定爲自己的DATAS（數據2），所以我選擇一個iframe來鎖定他從我的主窗口，因爲他可以在highcharts使用的功能，所以我可能會添加一些沙箱標籤在我的iframe時，第一部分將工作。

來源

2016-02-05 Nico_

您需要確定您在iframe中加載的頁面中包含Highcharts。 iframe是一個單獨的窗口，不會自動訪問其父項的所有內容。 **在你的小提琴的情況下，你需要確保你包括Highcharts - 我沒有看到它在你的資源列表**。 – jlbriggs

謝謝，但Highcharts被加載在iframe使用jQuery L.64，65和66 –

如何使用Highcharts構造函數？一個是'new Highcharts.Chart（options，callback）'，第二個是'Highcharts.chart（容器，選項，回調）'。它看起來像jQuery尚未加載，所以構造函數不附加到'$'命名空間。 –

我想你不應該用那樣的JavaScript注入你的腳本。而是創建一個動態頁面就像所有內容就會容易得多iframe.php。

I幀有限制的權利和加載你的腳本的方式並不能保證你就會爲iframe.php內容的另一個

簡單的例子後做了一個，只是通過iframe網址裏面了Data_ID：

<?php 
if (isset($_GET['data_id'])) 
$data = getGraphics($_GET['data_id']); 
?> 
<html> 
<head> 
</head> 
<body> 
<div id="panel_chart_container"></div> 
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script> 
<script src="https://code.highcharts.com/highcharts.js"></script> 
<script src="https://code.highcharts.com/highcharts-more.js"></script> 
<script src="https://code.highcharts.com/modules/exporting.js"></script> 
<script type='text/javascript'> 
$(document).ready(function(){ 
$('#panel_chart_container').highcharts(<?=$data;?>); 
}); 
</script> 
</body> 
</html>

來源

2016-04-13 09:46:07 mymyoux

我結束了使用其他內容而不是iframe，但您的解決方案工作perfeclty！非常感謝！ –

你用@Nico_做了什麼？ –

我回到@mymyoux的iframe解決方案，我不能安全地覆蓋我需要的每個案例（我使用了div，並且用javascript更改了html代碼，但由於我希望用戶能夠輸入數據， iframe更好地防止安全問題，否則用戶可能會破壞我的頁面）。 –

回答

相關問題