我正在使用 Google Ajax API,他们建议我google.setOnLoadCallback()
用来做与他们的 API 相关的各种事情,但我也使用 jQuery$(document).ready()
做其他与 Google API 无关的 JS 事情。
将这两种方法混合在一个文档中是否安全?我还没有注意到任何问题,但我想这是一个规模问题。
我正在使用 Google Ajax API,他们建议我google.setOnLoadCallback()
用来做与他们的 API 相关的各种事情,但我也使用 jQuery$(document).ready()
做其他与 Google API 无关的 JS 事情。
将这两种方法混合在一个文档中是否安全?我还没有注意到任何问题,但我想这是一个规模问题。
你几乎必须这样做:
google.setOnLoadCallback(function() {
$(function() {
// init my stuff
});
});
您不能$(document).ready()
没有$
(jQuery 对象)可用,因此需要进入回调内部。而且您不能确定文档在回调中是否准备就绪,因此您也必须这样做ready()
。
很抱歉从死里复活,但1)它仍然是这个问题的“答案”,2)我找到了更好的解决方案。
该函数有一个可选的第三个参数,google.load
它采用配置选项的对象。选项之一是callback
。它还消除了单独setOnLoadCallback
调用的需要。
例如
google.load('visualization', '1.0', {
'packages': "charttype",
'callback': $jQ.proxy(me.setupChart, me)
});
所以:
<script src="https://www.google.com/jsapi"></script>
<script>
$(document).ready(function () {
function mapsLoaded() {
etc etc etc
}
google.load("maps", "2", {"callback" : mapsLoaded});
});
</script>
如果您的 JavaScript 代码位于其自己的 js 文件中而不是 HTML 文档中,您也可以在文档中执行此操作:
<script>
google.load("jquery", "1.7.0");
google.load("jqueryui", "1.8.16");
google.setOnLoadCallback(function() {
var script = document.createElement("script");
script.setAttribute("type", "text/javascript");
script.setAttribute("src", "my.js");
document.getElementsByTagName("html")[0].appendChild(script);
});
</script>
这my.js
是在从谷歌加载所有其他内容之后加载的。在您的my.js
文件中,您可以执行$(document).ready(...)
. 因此,您的应用程序代码独立于“由 google 加载”或“直接从您的服务器加载”。
当你可以做到这一切时,为什么要混合$(document).ready()
?只需摆脱该google.setOnLoadCallback
功能并使用 jQuery 的$(document).ready()
.
这:
google.setOnLoadCallback(chartEnrollment);
变成
$(document).ready(chartEnrollment);