Добавить несколько событий window.onload

В моем пользовательском элементе управления ASP.NET я добавляю к window.onload событию некоторый JavaScript :

if (!Page.ClientScript.IsStartupScriptRegistered(this.GetType(), onloadScriptName))
  Page.ClientScript.RegisterStartupScript(this.GetType(), onloadScriptName, 
    "window.onload = function() {myFunction();};", true);            

Моя проблема в том, что если в onload событии уже что-то есть, то это перезаписывает его. Как я могу разрешить двум пользовательским элементам управления для каждого выполнения JavaScript в onload событии?

Изменить: спасибо за информацию о сторонних библиотеках. Я буду помнить о них.

Ответов (8)

Решение

Большинство предлагаемых «решений» специфичны для Microsoft или требуют раздутых библиотек. Вот один хороший способ. Это работает с W3C-совместимыми браузерами и с Microsoft IE.

if (window.addEventListener) // W3C standard
{
  window.addEventListener('load', myFunction, false); // NB **not** 'onload'
} 
else if (window.attachEvent) // Microsoft
{
  window.attachEvent('onload', myFunction);
}

Вы можете сделать это с помощью jquery

$(window).load(function () {
    // jQuery functions to initialize after the page has loaded.
});

Попробуй это:

window.attachEvent("onload", myOtherFunctionToCall);

function myOtherFunctionToCall() {
    // do something
}

edit: эй, я как раз собирался войти в систему с Firefox и переформатировать это сам! По-прежнему, похоже, не форматирует код для меня с IE7.

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

Page.ClientScript.RegisterStartupScript(
    this.GetType(), key1, function1, true);

Page.ClientScript.RegisterStartupScript(
    this.GetType(), key2, function2, true);

Я считаю, что это должно сработать.

Я мало что знаю об ASP.NET, но почему бы не написать специальную функцию для события onload, которая, в свою очередь, вызывает за вас обе функции? Если у вас есть две функции, вызовите их обе из третьего скрипта, который вы регистрируете для события.

Mootools - еще один отличный JavaScript-фреймворк, который довольно прост в использовании, и, как сказал RedWolves, с помощью jQuery вы можете просто отбрасывать столько обработчиков, сколько захотите.

Для каждого файла * .js, который я включаю, я просто заключаю код в функцию.

window.addEvent('domready', function(){
    alert('Just put all your code here');
});

И есть также преимущества использования domready вместо onload

По-прежнему существует уродливое решение (которое намного хуже, чем использование фреймворка или addEventListener / attachEvent ), которое заключается в сохранении текущего onload события:

function addOnLoad(fn)
{ 
   var old = window.onload;
   window.onload = function()
   {
       old();
       fn();
   };
}

addOnLoad(function()
{
   // your code here
});
addOnLoad(function()
{
   // your code here
});
addOnLoad(function()
{
   // your code here
});

Обратите внимание, что такие фреймворки, как jQuery, предоставляют способ выполнения кода, когда DOM готова, а не при загрузке страницы.

Готовность DOM означает, что ваш HTML загружен, но не загружены внешние компоненты, такие как изображения или таблицы стилей, что позволяет вызывать вас задолго до срабатывания события загрузки.

Сегодня у меня была аналогичная проблема, поэтому я решил ее index.js следующим образом:

window.onloadFuncs = [];

window.onload = function()
{
 for(var i in this.onloadFuncs)
 {
  this.onloadFuncs[i]();
 }
}

и в дополнительных файлах js, которые я хочу прикрепить к событию onload, мне просто нужно сделать это:

window.onloadFuncs.push(function(){
 // code here
});

Я обычно использую jQuery, но на этот раз я был ограничен чистым js, что заставило меня на некоторое время использовать мой разум!