Javascript 在iframe中加载Highcharts_Javascript_Jquery_Iframe_Highcharts

Javascript 在iframe中加载Highcharts

javascript jquery iframe highcharts

Javascript 在iframe中加载Highcharts,javascript,jquery,iframe,highcharts,Javascript,Jquery,Iframe,Highcharts,我试图在iframe中加载图表（使用Highcharts），我加载Highcharts，但控制台返回$（…）。Highcharts不是一个函数 $（''）.load（函数（）{ $（'#panel_frame_container'）.contents（）.find（'body'）.append（“”.end（） .find（'body'）.append（''）.end（） .find（'body'）.append（''）.end（） .find（'body'）.append（''）.end（）

我试图在iframe中加载图表（使用Highcharts），我加载Highcharts，但控制台返回$（…）。Highcharts不是一个函数

$（''）.load（函数（）{
$（'#panel_frame_container'）.contents（）.find（'body'）.append（“”.end（）
.find（'body'）.append（''）.end（）
.find（'body'）.append（''）.end（）
.find（'body'）.append（''）.end（）
.find（'body'）.append（''）.end（）
.find（'body'）.append（$（document）.ready（function（）{console.log（'loaded'）；$（'#panel_chart_container'））.highcharts（“+data2+”；）；”）；
})。附件（$（“.panel body”）；

我的目标是让用户设置为自己的数据（data2），因此我选择一个iframe将其锁定在我的主窗口之外，因为他可以在highcharts中使用函数，所以当第一部分开始工作时，我可能会在iframe中添加一些沙盒标记。

我认为您不应该将您的脚本像这样注入javascript。相反，创建一个包含所有内容的动态页面，如iframe.php，这样会更容易

iFrame的权限受到限制，您加载脚本的方式不能保证它们会一个接一个地完成

关于iframe.php内容的快速示例，只需在iframe URL内传递数据\u 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>


$（文档）.ready（函数（）{
$（“#面板_图表_容器”）.highcharts（）；
});

您需要确保在iframe中加载的页面中包含Highcharts。iframe是一个单独的窗口，不能自动访问其父窗口的所有内容。对于你的小提琴，你需要确保你包含了Highcharts——我在你的资源列表中没有看到它。谢谢，但是Highcharts是用jQuery l.64、65和66加载到iframe中的。使用Highcharts构造函数怎么样？一个是

newhighcharts.Chart（选项，回调）

，第二个是

Highcharts.Chart（容器，选项，回调）

。看起来jQuery还没有加载，所以构造函数没有附加到

名称空间。我最终使用的不是iframe，但您的解决方案运行良好！非常感谢！你用@Nico_uux做了什么？我回到了@mymyoux的iframe解决方案，我的解决方案不能安全地涵盖我需要的所有情况（我使用了div，我用javascript更改了html代码，但因为我希望用户能够输入数据，iframe更好地防止安全问题，否则用户可能会破坏我的页面）。

<?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>