包含 JavaScript 的 JQuery.load() 页面答案

【问题标题】：JQuery.load() page containingJavaScript包含 JavaScript 的 JQuery.load() 页面
【发布时间】：2013-01-05 19:38:36
【问题描述】：

我有一个 html 页面，其中包含一些用于从 Google API 生成图表的 javascript。当我直接访问该页面时，它按预期工作，显示图表。

<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load('visualization', '1.0', { 'packages': ['corechart'] });
google.setOnLoadCallback(drawChart);
function drawChart() {
   //// code to generate chart
   var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
   chart.draw(data, options);
}
</script>
<div id="chart_div">
   Chart Div
</div>

我想将此图表加载到另一个页面上。我尝试使用 JQuery 的 $.get 和 $.load，但都没有工作。如果我在页面中添加一些文本并调用 get/load 我可以看到文本但看不到图表 - 似乎 Javascript 没有执行。

我添加了alert('msg')，看到google.load被调用了，但没有调用其他JS。

在我想要包含图表的其他页面中，我有以下 JS：

$(document).ready(function () {
    $('#test').load('chart?param=1', function () {
        alert('Load was performed.');
    });
});

但“加载已执行”永远不会被击中。

【问题讨论】：

您的控制台出现什么错误？
您提供的代码中存在语法错误。 } 在第一部分无缘无故，也没有 }); 准备关闭文档。
抱歉在复制/粘贴时遗漏了括号。 google.load('visualization', '1.0', { 'packages': ['corechart'] });
SCRIPT5009: 'google' 未定义
好的。所以看起来https://www.google.com/jsapi 没有被加载。

标签： javascript jquery html

【解决方案1】：

“SCRIPT5009：‘google’未定义”

我怀疑这个 <script type="text/javascript" src="https://www.google.com/jsapi"></script> 在您 .load() 代码块时不起作用。由于 jQuery 已经在运行，试试这个

<!-- get rid of this <script type="text/javascript" src="https://www.google.com/jsapi" -->
<script type="text/javascript">
// does not need $(function()) unless you're running this on its own
// when loading this in using $.load() it's already ready.

$.getScript('https://www.google.com/jsapi', function(){
    google.load('visualization', '1.0', { 'packages': ['corechart'] });
    google.setOnLoadCallback(drawChart);
});
function drawChart() {
   //// code to generate chart
   var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
   chart.draw(data, options);
}
</script>

【讨论】：