Portée des variables dans un plugin
Bonjour,
imaginons une page html ultra minimaliste dans laquelle on créé un plugin JQuery :
Code:
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.
