Добавить обработчик событий для body.onload с помощью javascript внутри части <body>

Мы хотим включить в наш документ карты из API Карт Google. Документация сообщает инициализировать карту с помощью функции, вызванной событием onload() тела.

Обычный способ вызова:

<body onload="initialize_map();">

Это не сработает для нас, потому что мы используем Template:: Toolkit, а тег <body> уже включен в нашу оболочку. Короче: тег <body> уже напечатан, когда наш код javascript запущен.

Я пробовал что-то вроде этого, но он работает только для onclick, а не onload. Я предполагаю, что, поскольку код javascript находится под тегом <body>.

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

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

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

Любая помощь в том, как активировать карту Карт Google, ценится!

Ответы

Ответ 1

Поскольку мы уже использовали jQuery для графической функции для глазных конфет, мы в конечном итоге использовали это. Код типа

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

сделал все, что хотел, и заботится о несовместимости браузеров.

Ответ 2

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

Эта функция init() теперь запускает эту функцию и назначает все, что возвращается в событие загрузки.

Вы хотите назначить ссылку на функцию, а не результат. Поэтому вам нужно отбросить().

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

Также вы должны использовать window.onload, а не body.onload

addEventListener поддерживается в большинстве браузеров за исключением IE 8.

Ответ 3

Как указано в описании для стандартных браузеров 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);

Примечание: здесь я получаю прямую ссылку на элемент тела через документ, сохраняя необходимость в первой строке.

Кроме того, если вы используете jQuery и хотите использовать событие DOM ready, а не тело load s, ответ может быть еще короче...

$(init);

Ответ 4

Вместо этого вы должны использовать следующее (работает во всех новых браузерах):

window.addEventListener('DOMContentLoaded', init, false);

Ответ 5

Просто оберните код, который вы хотите выполнить, в событие onload объекта window:

window.onload = function(){ 
   // your code here
}