谷歌jsapi未能加載jquery對話框

我試圖從谷歌可視化api顯示一個圖表到一個jQuery對話框加載從另一個頁面的內容，但我收到一個JavaScript錯誤，說'谷歌沒有定義'時嘗試加載圖表。該示例有2個簡單頁面。託管對話框的'mainpage.htm'和託管圖表的動態加載到jQuery對話框的'chartpage.htm'。這是「mainpage.htm」：谷歌jsapi未能加載jquery對話框

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<script type="text/javascript" src="jquery-1.6.2.min.js"></script> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script> 
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1/themes/base/jquery-ui.css" type="text/css" /> 
<title></title> 
<script type="text/javascript"> 
function openchart() { 
    w = $(window).width() - 100; 
    h = $(window).height() - 100; 
    var url = "chartpage.htm"; 
    $("#chartDlg").load(url).dialog({ modal: true, width: w, height: h, title: 'MyChart', position: 'center' }); 
    $("#chartDlg").dialog('open'); 
} 
</script> 
</head> 
<body> 
<a href="javascript: openchart();">Show Chart</a> 
<div style="display:none" id="chartDlg"></div> 
</body> 
</html>

這是「chartpage.htm」

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<title></title> 
<script type="text/javascript" src="http://www.google.com/jsapi"></script> 
<script type="text/javascript"> 
    google.load('visualization', '1', { 'packages': ['annotatedtimeline'] }); 
    google.setOnLoadCallback(drawChart); 

    function drawChart() { 
     var data = new google.visualization.DataTable(); 
     data.addColumn('date', 'Date'); 
     data.addColumn('number', 'NYSE'); 
     data.addColumn('number', 'MIB'); 
     data.addColumn('number', 'CAC40'); 
     data.addRows([ 
      [new Date(2008, 1, 1), 30040, 18550, 40645], 
      [new Date(2008, 2, 1), 30300, 18550, 40645], 
      [new Date(2008, 3, 1), 32000, 18450, 47645], 
      [new Date(2008, 4, 1), 31000, 18650, 45645], 
      [new Date(2008, 5, 1), 35000, 18850, 44645], 
      [new Date(2008, 6, 1), 30600, 18350, 47645], 
      [new Date(2008, 7, 1), 34000, 18450, 48645], 
      [new Date(2008, 8, 1), 30500, 18450, 44645], 
      [new Date(2008, 9, 1), 30500, 18550, 45645], 
      [new Date(2008, 10, 1), 30400, 18950, 46645], 
      [new Date(2008, 11, 1), 34000, 18950, 47645], 
      [new Date(2008, 12, 1), 30500, 18400, 45645], 
      [new Date(2009, 1, 1), 34500, 18350, 44645], 
      [new Date(2009, 2, 1), 30460, 18250, 40645], 
     ]); 
     var chart = new google.visualization.AnnotatedTimeLine(document.getElementById('chart_div')); 
     chart.draw(data, { displayAnnotations: true, fill: 20 }); 
    } 
</script> 
</head> 
<body> 
    <div id="chart_div" style="width: 800px; height: 600px;"> 
</div> 
</body> 
</html>

的chartpage.htm打開作爲獨立的頁它的工作完美，它是當時只有失敗加載到Mainpage.htm對話框中。

看起來，谷歌jsapi根本沒有加載。

任何想法？

感謝

愛卡

來源

2011-08-05 Edika

的東西去嘗試夫婦。在對話框中的iframe

負載chartpage.htm（有沒有試過這種自己，但值得一試）：

<div style="display:none" id="chartDlg"><iframe src="chartpage.htm"></iframe></div>

，改變功能：

function openchart() { 
w = $(window).width() - 100; 
h = $(window).height() - 100; 
$("#chartDlg").dialog({ modal: true, width: w, height: h, title: 'MyChart', position: 'center' }); 
$("#chartDlg").dialog('open'); 
}

將google javascript添加到mainpage.htm：

<script type="text/javascript" src="http://www.google.com/jsapi"></script>

來源

2011-08-05 16:07:08

谷歌jsapi未能加載jquery對話框

回答

相關問題