Discussion :

[comode]

Bonjour,

imaginons une page html ultra minimaliste dans laquelle on créé un plugin JQuery :

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
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<div>test 1</div>
<div>test 2</div>
<script language="javascript">
$.fn.menu = function(options) {
 
	var defauts = {i : 0};
 
	this.each(function(){
		var parameters = $.extend(defauts, options); 
		$(this).on("click", function(event){parameters.i++;alert(parameters.i);});
	});
};
$("div").menu();
</script>

chaque clique sur une des 2 div va incrémenter le compteur qui est global bien que pourtant définit dans le callback du each.

Or, j'ai besoin de variables propres à chaque instance de mon plugin, et donc que le fait de cliquer sur un div ne fasse augmenter que son compteur, pas celui des autres div.

Si je vois bien plusieurs solutions bricolées et pas toujours très propres pour arriver à mes fins, je souhaiterais tout de même savoir quel est la bonne méthode pour obtenir le résultat escompter.

En vous remerciant.

[comode]

Pour recherche ultérieure, réponse obtenue sur stackoverflow.

$.extend utilise et retourne le 1er paramètre par référence !

Il faut donc lui passer en 1er paramètre un nouvel objet, sans quoi, tous les objets retournés seront les mêmes :

Code :

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

var parameters = $.extend({}, defauts, options);