appels de fonction [javascript]

<script language="javascript"> 
function toggle(id) { 
    alert('call'); 
    if (document.getElementById(id).style.display == "none") { 
     alert('now visible'); 
     document.getElementById(id).style.display = ""; 
    } else { 
     alert('now invisible'); 
     document.getElementById(id).style.display = "none"; 
    } 
} 
</script> 

</head> 
<body onload="toggle('image1');alert('test_body');toggle('image2')"> 

<script language="javascript"> 
alert('test_pre_function'); 
toggle('image1'); 
alert('test_after_function'); 
toggle('image2'); 
</script>

Cela ressemble à beaucoup de code mais c'est assez simple, donc je pense que la plupart d'entre vous n'auront pas de problèmes avec ça. toggle() devrait basculer l'état d'affichage des divs contenant des images.appels de fonction [javascript]

Lorsque l'utilisateur entre sur le site, les divs devraient se cacher, quand tout est chargé, les divs devraient apparaître. Curieusement, la fonction dans le corps (pas dans l'étiquette de corps) ne fonctionne que la moitié, je reçois et alerte 'test_pre_function' et j'obtiens un 'appel' d'alerte (hors de la fonction), mais c'est il. Le code dans l'étiquette de corps fonctionne très bien.

Je trouve cela bizarre parce que c'est censé faire exactement la même chose deux fois et une fois qu'il fonctionne, une autre fois pas, donc je suppose que j'ai dû faire une erreur stupide.

Source

2010-05-24 Samuel

Un débogueur Javascript tel que Firebug vous aidera à résoudre ce genre de problèmes. Cela vous permettra de voir les erreurs JavaScript normalement cachées. – Schwern

@Schwerm: D'accord, je vais certainement y jeter un coup d'oeil – Samuel

Le script est exécuté dès qu'il est analysé. Si image1 et image2 n'ont pas été analysés lors de l'exécution du script, document.getElementById("image1") renverra null alors .style.display lancera un "est null ou une erreur d'objet". Cela explique pourquoi les deux alertes fonctionnent - l'exécution s'arrête à la première ligne document.getElementById(id).style.display == "none".

Déplacez le script après les éléments d'image dans le document et cela devrait fonctionner.

<script> 
    alert(document.getElementById("image1")); // -> null 
</script> 
<img id="image1" src="some/image.jpg" /> 
<script> 
    alert(document.getElementById("image1")); // -> object 
</script>

Source

2010-05-24 09:50:49

bien sûr * dow * merci! – Samuel

Avez-vous manqué ceci?

alert('now visible'); 
document.getElementById(id).style.display = "block";

Source

2010-05-24 09:51:38

Non cela fonctionne sans :) – Samuel

@Samuel Réponse d'Andy vaut la peine d'essayer .. –

je sais, c'est la solution, je ne peux pas marquer encore répondu, cependant, attendre 2 min plus – Samuel

Essayez cette http://jsfiddle.net/hUDb4/

var toggle = (function() { 
    // an object to keep state for elements 
    var state = {}; 
    return function(id){ 
     document.getElementById(id).style.display = (state[id] = !state[id]) ? "none" : "block"; 
    }; 
})(); 


toggle("myid"); // none 
toggle("myid"); // block

Mais la question principale est ici que d'autres ont déclaré que les DOM n'est pas prêt tant que le document soit complètement chargé.

Source

2010-05-24 09:51:38

-1

vous avez utilisé l'alerte dans le corps en charge. fondamentalement une fois l'alerte sera exécutée, il vous demande de cliquer sur OK. Pendant ce temps, la dernière fonction peut être mise au point différée.

voir ci-dessous

<script> 
    alert(document.getElementById("image1")); 
    <img id="image1" src="some/image.jpg" /> 
    alert(document.getElementById("image1")); 
</script>

Source

2010-05-24 09:57:05

C'est un copier-coller fantastique. –

appels de fonction [javascript]

Répondre

Questions connexes