onclick + onload

Version imprimable

onclick + onload

Bonjour,

J'ai cette superbe fonction :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<script type="text/javascript" language="Javascript">
 	head.js("http://code.jquery.com/jquery-1.9.0.min.js",
		function(){
			$(function(){
 
				$(".bouton").on("click", function(){
<!--Quand on clique sur un élément de la classe "bouton"-->
					$( "div[id^='ID']" ).hide();
<!--Cacher toutes les DIV qui contiennent ID-->
						$( "#ID" + $( this ).attr('id') ).show();
<!--Montrer l'élément qui s'appelle ID plus (le id du bouton)-->
					});
 				});
 			}
		);
</script>

Vous aurez compris que ça s'exécute quand on clique sur des boutons. Comment faire pour que ça s'exécute aussi quand on charge la page?

Merci à l'avance.

PS : Je suis un peu con.

04/06/2013, 07h26
nicosmash

Bonjour,

Dans le body il faut mettre onload="nomDeLaFonction" :

http://www.w3schools.com/jsref/event_body_onload.asp
04/06/2013, 08h01
Bovino

Ce que tu exécutes dans le .on('click', ...) est une fonction. Il suffit donc juste d'appeler cette fonction (exécuter son code en tout cas) dans le .ready().
Autre chose : ne met pas de commentaires HTML dans du code JavaScript !

nicosmash : ta solution n'est pas la meilleure. D'une part, le onload sur le body va attendre que l'intégralité de la page soit chargée et surtout, le .ready() de jQuery permet d'attacher autant de fonctions que l'on veut qui s'exécuteront lorsque le DOM sera complètement chargé.
Donc quand on utilise jQuery, il est maladroit de passer par le onload du body. ;)
04/06/2013, 08h05
nicosmash

Ah mince c'est pour ça que ma page ce charge sans les couleurs de thèmes choisit puis effectue le remplissage de couleur ... 8O

Je te remercie :ccool:

confirmation

Merci à vous deux,

@Bovino :

D'accord, donc appeler deux fois la fonction, comme ça? :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 <script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/headjs/0.99/head.min.js"></script> <script type="text/javascript" language="Javascript"> head.js("http://code.jquery.com/jquery-1.9.0.min.js", $(document).ready(function(){ function(){ $( "div[id^='ID']" ).hide(); $( "#ID" + $('pres').show(); }); }); function(){ $(".bouton").on("click", function(){ $( "div[id^='ID']" ).hide(); $( "#ID" + $( this ).attr('id') ).show(); }); } ); </script>
Jusqu'ici ça ne fonctionne pas, mais j'ai peut-être fait une erreur aussi, c'était juste pour savoir si je suis dans la bonne voie.

Remarque : j'ai modifié un peu la première instance de la fonction pour qu'elle affiche la section ''pres'' directement sur onload.

Remarque 2 : je parle espéranto et ton avatar ça veut dire ''vache'' en espéranto