为什么google.load会导致我的页面变成空白？
嗯，这看起来很奇怪，但我找不到解决方案。
到底为什么google.load会显示页面内容，而当出现fiddle时，页面却变成空白呢？
如果google.load是立即完成的，那么它工作得很好，但是延迟它根本不起作用。
这里是给懒惰(或聪明)的人的页面源代码：
<!DOCTYPE html>
<html lang="en">
<head>
<title>Ciao</title>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
</head>
<body>
<h1>Test</h1>
<div id="quicivanno">
<p>ciao</p>
</div>
</body>
<script type="text/javascript">
setTimeout(function() {google.load('visualization', '1.0', {'packages':['corechart']});}, 2000);
</script>
</html>回答 5
Stack Overflow用户
发布于 2012-03-02 00:49:53
看起来google.load正在使用document.write()将脚本添加到页面中，如果在页面加载之后使用它，则会清除html。
这解释了更深入的内容：http://groups.google.com/group/google-ajax-search-api/browse_thread/thread/e07c2606498094e6
使用其中一个想法，您可以使用load的回调来强制它使用append而不是doc.write：
setTimeout(function(){google.load('visualization', '1', {'callback':'alert("2 sec wait")', 'packages':['corechart']})}, 2000);这演示了延迟警报窗口的2秒等待时间
Stack Overflow用户
发布于 2014-07-27 19:04:49
您只需定义一个回调，它将不会清除页面(也许旧版本的google.load()可以，但显然，如果与回调一起使用，新版本就不会)。下面是我加载"google.charts“库时的一个简化示例：
if(google) {
google.load('visualization', '1.0', {
packages: ['corechart'],
callback: function() {
// do stuff, if you wan't - it doesn't matter, because the page isn't blank!
}
} )
}当我这样做的时候，我仍然得到了空白页面--但是有了callback，我的问题就解决了。
Stack Overflow用户
发布于 2014-02-10 08:17:29
注意:以下是避免时间延迟的好方法--它恰到好处。该示例通常可供所有脚本使用(需要它)，但特别适用于Greasemonkey。它还使用了Google chart API作为示例，但此解决方案超越了其他Google API，可以在任何需要等待脚本加载的地方使用。
在使用google.load添加谷歌图表时，使用带回调的Greasemonkey并不能解决这个问题。在这个过程中(Greasemonkey注入到页面中)，添加了www.google.com/jsapi脚本节点。在为Google的jsapi javascript添加这个元素之后，注入的(或页面)脚本就可以使用google.load命令(需要在添加的节点中加载)，但是这个jsapi脚本还没有加载。设置超时是可行的，但超时只是Google jsapi脚本加载与injected/page脚本的计时竞赛的一种变通方法。移动脚本执行google.load (可能还有google.setOnLoadCallback)的位置可能会影响计时竞争情况。下面提供了一个在调用google.load之前等待google script元素加载的解决方案。下面是一个示例：
// ********* INJECTED SCRIPT *********//
// add element
var gscript = document.createElement('script');
gscript.setAttribute("type", "application/javascript");
gscript.setAttribute("id", "XX-GMPlusGoogle-XX");
document.body.appendChild(gscript);
// event listener setup
gscript.addEventListener("load",
function changeCB(params) {
gscript.removeEventListener("load", changeCB);
google.load("visualization", "1", {packages:["corechart"], "callback":
function drawChart() {
var data;
// set the durationChart data (not in example)
data = new google.visualization.arrayToDataTable(durationChart);
var options = {
title:"Chart Title",
legend: {position:"none"},
backgroundColor:"white",
colors:["white","Blue"],
width: window.innerWidth || document.body.clientWidth,
height: window.innerHeight || document.body.clientHeight,
vAxis: {title: "Durations", baselineColor: "black", textStyle:{fontSize:12}},
hAxis: {title: "Days Since First Instance"},
height: ((cnt > 5)? cnt * 50 : 300),
isStacked: true
}; // options
// put chart into your div element
var chart = new google.visualization.BarChart(document.getElementById('XX-ChartDiv-XX'));
chart.draw(data, options);
} // drawChart function
}); //packages within google.load & google load
} // callback changeCB
);
// can use SSL as "https://www.google.com/jsapi";
gscript.src = "http://www.google.com/jsapi";https://stackoverflow.com/questions/9519673
复制相似问题
腾讯云开发者
