11540 sujets

JavaScript, DOM et API Web HTML5

Bonjour,

dans une page web , j'ai une série de vignettes, avec la classe vingOccas.
Quand je clique sur une de ces vignettes, je change le src d'une image qui a l'id bigPic-xx (xx étant un identifiant récupéré sur la vignette).

Tout ça est hyper classique.

J'ai rajouté une classe selectedOccas sur la vignette cliquée qui a l'effet de rajouter une bordure autour de la vignette pour signaler que c'est celle qui est active. Et donc quand je clique sur une nouvelle vignette, j'enlève cette classe selectedOccas partout et je l'affecte sur la nouvelle vignette active, logique.

voici mon code jQuery

	$("img.vignOccas").click(function()  {
		
		$("img.vignOccas").each(function() { $(this).removeClass("selectedOccas"); });
		
		var $this = $(this);
		$this.addClass("selectedOccas");
		var num = $this.attr("src").substr(16,2);
		var targetSrc = $this.attr("src").substr(19,3);
		$("img#bigPic-" + num).attr("src","images/occasion/" + num + "-" + targetSrc + "-big.jpg");	
	});


il fonctionne... mais je le trouve pas optimal. J'aimerais éviter d'avoir à réutiliser $("img.vignOccas") à l'intérieur de la fonction du click. En plus, j'utilise deux fois le $(this) : dans le each() et dans la fonction.

Est ce logique, et ce code est il optimisable?

merci
Modifié par lionel_css3 (04 Dec 2012 - 12:30)
Hello !

Tu peux simplifier
$("img.vignOccas").each(function() { $(this).removeClass("selectedOccas"); });

par
$(".selectedOccas").removeClass("selectedOccas");

Et tu n'as pas besoin de mettre $(this) dans une variable.
Merci Oken !!

c'est génial, j'y avais pas pensé... c'est vrai que c'est plus simple, et jQuery c'est vraiment magique.
mais je laisse quand même $(this) dans une variable pour la suite du script étant donné qu'il y a 3 appels.