Discussion :

[nicolas2603]

Bonjour, je fais appel à votre aide pour trouver la syntaxe correcte me permettant d'appeler une fonction lors du clic d'un bouton. Je m'explique.

J'initialise une fonction au chargement de la page, et celle-ci est exécutée lors du clic d'un bouton définit dans l'initialisation.
Pour certaines raisons, j'ai besoin de sortir de l'initialisation le bouton exécutant la fonction, mais du coup, elle ne s'exécute plus.

Voici mon code pour que ce soit plus clair :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
$(document).ready(function() {
	var playing = function() {
		var game = 3,
		start = function() {
			game = false;
			return false;
		},
		play = function() {
			if (game == false) {
				// ici le détail de la fonction
			}
			return false;
		};
		return {
			init: function() {
				$('#bouton').bind('click', start).bind('click', play);
			}
		};
	}();
	$(document).ready(playing.init); // Cas 1 : le click sur #bouton exécute bien la fonction
	$('#bouton').click(function() { playing.init; });  // Cas 2 : le click sur #bouton ne fait rien
	$('#bouton').click(function() { playing(); });  // Cas 3 : "playing" n'est pas une fonction
});

Avez-vous une idée de solution ?
Merci d'avance.

[nicolas2603]

Désolé, je m'auto-réponds.
A priori, problème résolu en transformant var playing = function() en function playing().
En adaptant ensuite l'appel, cela semble tourner...

[Kaamo]

Il faut bien comprendre ce que fait la fonction anonyme attribuée à la variable playing. En lui collant () à la fin, cette fonction est directement exécutée et le résultat et attribué à playing.
En effet, en l'exécutant directement comme tu le fais, cette fonction anonyme retourne un objet contenant une méthode : Object {init: function}.
Tu as simulé une sorte d'encapsulation. start et et play ne sont disponibles que dans la fonction anonyme attribuée à la variable playing. On peut dire que ce sont des méthodes privées en quelque sorte.

Analysant les 3 cas :
Cas 1 : Tu es déjà dans le $(document).ready !

Cas 2 : Tu oublies les parenthèses pour déclencher l'exécution de la fonction ! (playing.init();). Dans ton cas, tu as simplement passé la référence de la fonction dans une fonction. Sinon tu pourrais faire ça : $('#bouton').click(playing.init);
Cas 3 : Comme expliqué précédemment, playing n'est pas une fonction mais un objet !

Une piste de solution :

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
$(document).ready(function() {
	var playing = function() {
		var game = 3,
		start = function() {
			game = false;
			return false;
		},
		play = function() {
			if (game == false) {
				// ici le détail de la fonction
			}
			return false;
		};
		return {
			init: function() {
				start();
                                play();
			}
		};
	}();
	$('#bouton').click(function() { playing.init(); });
});

[nicolas2603]

Bonjour, et merci pour ces explications qui m'ont éclairci les idées.
Du coup j'ai tenté de m'inspirer de l'exemple ci-dessus, et je me retrouve avec un erreur "playing.init is not a function" !

EDIT : mille excuses, une erreur de frappe s'était glissée !! Ca fonctionne impeccable, merci !