1
votes

window.onload ne se déclenche pas pour la fonction nommée onload

Aujourd'hui, j'ai rencontré un problème étrange:

window.onload ne semble pas se déclencher lors du référencement d'une fonction appelée onload.

Je n'ai jamais remarqué cela auparavant:

Test 1 :

window.onload=onload2;
function onload2(){
  console.log('event fired');
}

Test 2 :

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

Pourquoi le premier code ne fonctionne-t-il pas?


0 commentaires

4 Réponses :


0
votes

Onload est une fonction javascript préconfigurée / prédéfinie que vous ne pouvez pas écraser. Cela ne fonctionne pas.


0 commentaires

0
votes

Cela se produit à cause de la portée. Si vous omettez window. dans votre deuxième exemple, l'alerte se déclenchera toujours < / a>. Dans le premier exemple, vous écrasez la fonction window.onload .


0 commentaires

0
votes

Si vous le faites de cette manière, vous écraserez la fonction prédéfinie onload construite à partir de javascript. Mais si vous voulez donner le nom onload à votre fonction, vous pouvez le faire de cette façon.

<!DOCTYPE html>
<html>
<body onload="onload()">

<h1>Hello World!</h1>

</body>
</html>
function onload() {
  alert("Page is loaded");
}


1 commentaires

document.body.onload = onload est également un moyen programmatique



-1
votes

Le problème ici est que dans les navigateurs Web, la fenêtre est définie comme objet global. Cela signifie que window.onload et onload font référence à la même propriété.

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

Donc ce que vous faites essentiellement est

(function() {
  window.onload = onload;

  function onload() {
    console.log('event fired');
  }
})();

qui ne change rien.

Si vous voulez une fonction avec le même nom, vous pouvez le mettre dans un IIFE (ou dans n'importe quel fonction d'ailleurs). Dans ce cas, la fonction que vous définissez ne sera pas placée dans la portée globale et ne sera donc pas en conflit avec le window.onload existant .

window.onload = window.onload;

Si vous n'évaluez pas nécessairement le nom de la fonction, vous pouvez, en plus de changer le nom de la fonction, attribuer également la fonction directement au onload comme ceci:

console.log(window.onload === onload); // true


0 commentaires