Question

我有一个母版页，使用jquery.load调用其他网页，例如

$("#loading").show();
$("#arena").load('Project.prx?PID=' + dataReport);
$("#loading").hide();

（Project.prx使用像ColdFusion这样的内部CGI语言，它可以提供HTML和JavaScript。）

在浏览器调试器中，每次点击链接时都会收到如下错误消息，即

Uncaught Highcharts error #16: www.highcharts.com/errors/16

Highcharts网站上提到了这个错误：

Highcharts Error＃16

页面中已定义的Highcharts

第二次在同一页面中加载Highcharts或Highstock时会发生此错误，因此已经定义了Highcharts命名空间。请记住Highcharts.Chart构造函数和Highcharts的所有功能都包含在Highstock中，因此如果您组合运行Chart和StockChart，则只需加载highstock.js文件。

由于我正在使用jquery的load（）并以当前文档中的div为目标，因此Highcharts声称我正在加载命名空间的第二个实例是公平的。不过，这就是我想要做的。

那么有没有想过如何将其他Highcharts页面加载到具有Highcharts命名空间的现有实例的页面中？

LATER

我没有在控制器中放置高级图表，只在目标中发布

，我取得了一些成功

$("#loading").show();
$("#arena").empty();
delete(Highcharts);
$("#arena").load('Project.prx?PID=' + dataReport);
$("#loading").hide();

然而，这并未证明在每种情况下都是成功的。

Answer 1

对于Highcharts声称我正在装载第二个是公平的呼吁命名空间的实例。不过，这就是我想要做的。

我不认为实际上是你想做什么。永远不会有两次加载highcharts库的理由。您只想在同一页面上加载两个图表。

简单的解决方案：

从prx文件的输出中删除<script src="http://code.highcharts.com/highcharts.js"></script>（或者加载此文件）。无需致电delete(Highcharts);我不认为这条线在这种情况下甚至没有做任何事情。

稍强一些的解决方案：

如果您需要能够通过浏览器直接访问Project.prx?id=123（可能用于测试），则需要根据其调用方式将该输出包装为完整的HTML。

现代浏览器将包含标题X-Requested-With: XMLHttpRequest，您可以在服务器代码中测试该标题，并相应地提供包装或上传的图表;但是，这种方法真的不可靠。更可靠的解决方案是在查询字符串中指定您希望的方式。例如，您可以将它设置为Project.prx？id = 123将为您提供：

<div id="container"></div>
<script type="text/javascript" >
    $('#container').highcharts({
       ...
    });
</script>

但是Project.prx？id = 123＆amp; v = test会给你：

<!DOCTYPE html>
<html>
<head>
    <title>Data Report 123</title>
    <script src="//code.jquery.com/jquery-2.1.0.js" type="text/javascript" ></script>
    <script src="http://code.highcharts.com/highcharts.js" type="text/javascript" ></script>
</head>
    <body>
        <div id="container"></div>
        <script type="text/javascript" >
            $('#container').highcharts({
            ...
            });
        </script>
    </body>
</html>

Answer 2

最好不要加载加载的文件。您可以通过在主页面中加载一次Highcharts并且不加载任何后来加载的Highcharts页面来实现。

第二个解决方案是将图表放在单独的iframe中。

另一种方法是在Highcharts页面中使用JavaScript加载Highcharts库，同时使用＆＃39; if＆＃39;检查它是否已经加载。

Answer 3

您可以在iframe中加载Project.prx。

使用jquery.load加载多个Highcharts

3 个答案: