Подтвердить что ты не робот

Добавьте две функции в window.onload

У меня есть две функции в моей форме, за исключением того, что один не работает, если другой активен. Вот мой код:

window.onload = function(event) {
    var $input2 = document.getElementById('dec');
    var $input1 = document.getElementById('parenta');
    $input1.addEventListener('keyup', function() {
        $input2.value = $input1.value;
    });
}

window.onload=function(){
    document.getElementById('enable').onchange=function(){
        var txt = document.getElementById('gov1');
        if(this.checked) txt.disabled=false;
        else txt.disabled = true;
    };
};

Я имею в виду, что когда у меня есть обе эти функции в моей форме, вторая функция работает нормально, но первая не будет работать, если выберете вторую функцию, первая будет работать нормально, почему это происходит? Это из-за имен?

4b9b3361

Ответ 1

Попробуйте поместить все коды в один и тот же метод [и только 1] onload!

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

Ответ 2

window.addEventListener("load",function(event) {
    var $input2 = document.getElementById('dec');
    var $input1 = document.getElementById('parenta');
    $input1.addEventListener('keyup', function() {
        $input2.value = $input1.value;
    });
},false);

window.addEventListener("load",function(){
    document.getElementById('enable').onchange=function(){
        var txt = document.getElementById('gov1');
        if(this.checked) txt.disabled=false;
        else txt.disabled = true;
    };
},false);

Документация здесь

Обратите внимание, что это решение может не работать в браузерах. Я думаю, вам нужно полагаться на 3-ю библиотеку, такую ​​как jquery $(document).ready

Ответ 3

Если вы не можете объединить функции по какой-либо причине, но у вас есть контроль над одним из них, вы можете сделать что-то вроде:

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

var prev_handler = window.onload;
window.onload = function () {
    if (prev_handler) {
        prev_handler();
    }
    // second code here...
};

Таким образом, вызываются оба обработчика.

Ответ 4

Вы не можете назначить две различные функции window.onload. Последний всегда будет побеждать. Это объясняет, почему, если вы удаляете последний, первый начинает работать, как ожидалось.

Похоже, вы должны просто объединить второй код функции в первый.

Ответ 5

Потому что ты его переопределяешь. Если вы хотите сделать это с помощью onload, вы можете просто расширить предыдущую функцию. Вот один из способов сделать это:

Function.prototype.extend = function(fn) {
  var self = this;
  return function() {
    self.apply(this, arguments);
    fn.apply(this, arguments);
  };
};

window.onload = function() {
  console.log('foo');
};

window.onload = window.onload.extend(function() {
  console.log('bar');
});

// Logs "foo" and "bar"

Демо: http://jsbin.com/akegut/1/edit

Изменить: Если вы хотите расширить несколько функций, вы можете использовать это:

Function.prototype.extend = function() {
  var fns = [this].concat([].slice.call(arguments));
  return function() {
    for (var i=0; i<fns.length; i++) {
      fns[i].apply(this, arguments);
    }
  };
};

window.onload = window.onload.extend(function(){...}, function(){...}, ...);

Ответ 6

window.addEventListener не будет работать в IE, поэтому используйте window.attachEvent

Вы можете сделать что-то вроде этого

function fun1(){
    // do something
}

function fun2(){
    // do something
}


var addFunctionOnWindowLoad = function(callback){
      if(window.addEventListener){
          window.addEventListener('load',callback,false);
      }else{
          window.attachEvent('onload',callback);
      }
}

addFunctionOnWindowLoad(fun1);
addFunctionOnWindowLoad(fun2);

Ответ 7

Если вы абсолютно должны иметь отдельные методы, инициированные в результате window.onload, вы можете подумать о настройке очереди функций обратного вызова, которые будут запущены.

Это может выглядеть так в простейшей форме:

var queue = [];
var loaded = false;

function enqueue(callback)
{
    if(!loaded) queue.push(callback);
    else callback();
}

window.onload = function()
{
    loaded = true;
    for(var i = 0; i < queue.length; i++)
    {
        queue[i]();
    }
}

И используется в вашем случае так:

enqueue(function()
{
    var $input2 = document.getElementById('dec');
    var $input1 = document.getElementById('parenta');
    $input1.addEventListener('keyup', function()
    {
        $input2.value = $input1.value;

    });

});

enqueue(function()
{
    document.getElementById('enable').onchange=function()
    {
        var txt = document.getElementById('gov1');
        if(this.checked) txt.disabled=false;
        else txt.disabled = true;
    };

});

Ответ 8

В течение некоторого времени я использовал вышеупомянутое решение с помощью:

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

var prev_handler = window.onload;
window.onload = function () {
    if (prev_handler) {
        prev_handler();
    }
    // second code here...
};

Однако в некоторых случаях IE вызывал "ошибку", описанную здесь в этом сообщении: "Переполнение стека в строке 0" в Internet Explorer и хорошая запись на нем здесь

Прочитав все предлагаемые решения и имея в виду, что jquery недоступен, это то, что я придумал (дальнейшее расширение решения Khanh TO с некоторой проверкой совместимости с браузером), как вы думаете, такая реализация будет подходящей:

function bindEvent(el, eventName, eventHandler) {
            if (el.addEventListener){
                    el.addEventListener(eventName, eventHandler, false); 
                } else if (el.attachEvent){
                    el.attachEvent("on"+eventName, eventHandler);
                }
            }
      render_errors = function() {
      //do something
      }

      bindEvent(window, "load", render_errors);

      render_errors2 = function() {
      //do something2
      }

      bindEvent(window, "load", render_errors2);

Ответ 9

Если вы не можете получить доступ к старому окну. Загрузка еще сохраняется и добавляет еще один, вот путь,

       function addOnload(fun){
          var last = window.onload;
          window.onload = function(){
            if(last) last();

            fun();
          }
        } 

       addOnload(function(){
            console.log("1 window is loaded");
        });

        addOnload(function(){
            console.log("2 window is loaded");
        });

        addOnload(function(){
            console.log("3 window is loaded");
        });

        addOnload(function(){
            console.log("4 window is loaded");
        });

Ответ 10

Когда вы помещаете вторую функцию в window.onload, в основном то, что вы делаете, заменяет значение. Как кто-то сказал, прежде чем вы можете поставить две функции в одну функцию и установить для нее window.onload. Если вы смущены, подумайте об этом таким образом, если у вас есть объект object, и вы сделали object.value = 7; object.value = 20, значение будет 20 window - это просто еще один объект

Ответ 11

Вы не можете привязать несколько функций к window.onload и ожидать, что все эти функции будут выполнены. Другой подход - использовать $(document).ready вместо window.onload, если вы уже используете jQuery в своем проекте.

Ответ 12

Сохраняя 2 window.onload(), выполняется код в последнем фрагменте.

Ответ 13

Просто используйте (jQuery):

$(window).load(function() {
  //code
}

$(window).load(function() {
 //code
}