37

我们希望在我们的文档中包含来自 Google Maps API 的地图。文档告诉使用onload()主体事件调用的函数初始化地图。

普通的调用方式：

<body onload="initialize_map();">

这对我们不起作用，因为我们正在使用Template::Toolkit并且<body>标签已经包含在我们的包装器中。简而言之：<body>当我们的 Javascript 代码开始运行时，标签就已经打印出来了。

我试过这样的东西，但它只适用于onclick，而不是onload。<body>我猜那是因为 Javascript 代码位于标签本身的下方。

var body = document.getElementsByTagName("body")[0];

body.addEventListener("load", init(), false);

function init() {
        alert("it works!");
};

任何帮助如何启动谷歌地图地图表示赞赏！

4

5 回答 5

46 
body.addEventListener("load", init(), false);

该 init() 表示现在运行此函数并将其返回的任何内容分配给加载事件。

您想要的是将引用分配给函数，而不是结果。所以你需要删除（）。

body.addEventListener("load", init, false);

你也应该使用 window.onload 而不是 body.onload

addEventListener除 IE 8 外，大多数浏览器都支持。

于 2011-02-22T18:26:40.543 回答
42

您应该真正使用以下内容（适用于所有较新的浏览器）：

window.addEventListener('DOMContentLoaded', init, false);
于 2014-06-15T17:02:36.320 回答
19

正如@epascarello 提到的 W3C 标准浏览器，您应该使用：

body.addEventListener("load", init, false);

但是，如果您希望它也适用于 IE<9，您可以使用：

var prefix = window.addEventListener ? "" : "on";
var eventName = window.addEventListener ? "addEventListener" : "attachEvent";
document.body[eventName](prefix + "load", init, false);

或者，如果您希望它在一行中：

document.body[window.addEventListener ? 'addEventListener' : 'attachEvent'](
    window.addEventListener ? "load" : "onload", init, false);

注意：这里我通过文档直接引用了 body 元素，省去了对第一行的需要。

此外，如果您使用的是 jQuery，并且您想使用DOM ready事件而不是 body 时load，答案可能会更短......

$(init);
于 2012-12-12T11:47:04.910 回答
8

由于我们已经使用 jQuery 来实现图形化的视觉效果，所以我们最终使用了它。像这样的代码

$(document).ready(function() {
    // any code goes here
    init();
});

做了我们想做的一切，并且自己关心浏览器的不兼容性。

于 2011-02-24T09:07:53.587 回答
3

只需将要执行的代码包装到窗口对象的 onload 事件中：

window.onload = function(){ 
   // your code here
}
于 2011-02-22T18:27:17.517 回答