Utiliser des variables en dehors des fonctions

Version imprimable

Bonjour,
Pouvez-vous m'indiquer comment je peux faire pour que ma variable "test" soit réutilisée (et donc connue) dans la fonction avgrund.
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 //Récupère ce que contient le HREF de l'objet cliqué $('a.linkLocation').click(function(){ url = $(this).attr('href'); //Puis effectuer la requete ajax pour récupérer l'iframe qui correspond à l'HREF et l'enferme dans une variable recupIframe $.get('infomap.php?url='+url, function(data) { var recupIframe = data; alert(recupIframe); }); }); //Plugin qui permet d'afficher une fenêtre modale dans laquelle il y aura donc l'iframe que je place à l'option Template $('.linkLocation').avgrund({ width: 450, // max is 640px height: 400, // max is 350px showClose: true, template: recupIframe });
Le but étant donc que lorsque l'utilisateur va cliquer sur un lien une div s'ouvre en jQuery dans laquelle y'a un iframe (une carte googlemap) mais le href google map doit changer dynamiquement via php. En fonction du lien cliqué la carte change. Donc j'utilise Ajax pour effectuer la requete de façon transparente.
Si on regarde le plugin avgrund, à l'option "template", c'est ici que j'insère l'iframe, qui sera donc contenu dans la variable "test" récupéré via AJAX plus haut avec $.get.

Problème la variable recupIframe est inconnue au moment où javascript essaie de la charger à l'option template, car en dehors de la fonction AJAX.

Comment pourrais-je faire pour m'en sortir s'il vous plaît.
Merci à tous.
RS

Pas de code HTML?

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
 
//Récupère ce que contient le HREF de l'objet cliqué
 
$('a.linkLocation').click(function(){
console.log("okok click");
				url = $(this).attr('href');
//Puis effectuer la requete ajax pour récupérer l'iframe qui correspond à l'HREF et l'enferme dans une variable recupIframe
				$.get('infomap.php?url='+url, function(data) {
					var recupIframe = data;
					alert(recupIframe);
					//on affecte les données au DOM
                    $(this).children( ".linkLocation" ).attr("data",data);
                    // ou selon si l'élément a contient la class linkLocation
                    $(this).attr("data",data);
				});
			});
 
			//Plugin qui permet d'afficher une fenêtre modale dans laquelle il y aura donc l'iframe que je place à l'option Template
			$('.linkLocation').avgrund({
				width: 450, // max is 640px
				height: 400, // max is 350px
				showClose: true,
 				template: $(this).attr("data")
			});

Bonne soirée.

12/08/2013, 12h50
RollinGStaR95

Bonjour et merci de ton aide.
Si j'ai bien compris tu stockes le résultat de la requête AJAX dans un attribut "data" de la balise a qui a la classe "linkLocation".
L'attribut "data" n'existe pas en HTML je crois.
Bref, le problème c'est que lorsque j'essaie de réafficher le contenu dans le plugin avgrund avec

Code:

$(this).attr("data")

Ca marche pas.
Mon HTML en question est le suivant.

Code:

<td class="borderRight"><a href="http://goo. gl/maps/fyAvB" class="linkLocation">Stade de France</a></td>

Merci de ton aide.

Si tu as besoin d'une info après l'exécution de ta requête AJAX intuitivement je placerais le traitement dans la fonction de callback :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
//Récupère ce que contient le HREF de l'objet cliqué
$('a.linkLocation').click(function() {
	url = $(this).attr('href');
	//Puis effectuer la requete ajax pour récupérer l'iframe qui correspond à l'HREF et l'enferme dans une variable recupIframe
	$.get('infomap.php?url='+url, function(data) {
		//Plugin qui permet d'afficher une fenêtre modale dans laquelle il y aura donc l'iframe que je place à l'option Template
		$('.linkLocation').avgrund({
			width: 450, // max is 640px
			height: 400, // max is 350px
			showClose: true,
			template: data
		});
	});
});

Bonjour,
s'il s'agit simplement de déclarer une variable globale, on la déclare avec var ...; EN DEHORS de toute fonction :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 var variable_globale = 1; function test(){ var test1 = variable_globale + 3; variable_globale = test1; return test1; } test(); alert( variable_globale ); test(); alert( variable_globale ); test(); alert( variable_globale );

13/08/2013, 14h59
RollinGStaR95

Merci de vos réponses. J'ai trouvé le solution.
ymoreau < J'avais déjà essayé de placer le plugin dans le callback mais ça ne fonctionnait pas. C'est ce qui paraît évident et c'est ce qu'il faut faire d'ailleurs. Le problème c'est tout simplement l'évènement Click.

En fait, je mets en place une fonction lorsque .linkLocation est cliqué et ensuite, au retour de la requête AJAX j'effectue de nouveau quelque chose quand .linkLocation est cliqué et là c'est pas possible.

J'ai modifié le premier évènement en mouseover. Du coup quand on passe la souris sur .linkLocation ça déclenche la requête AJAX et quand on clique, ça déclenche le plugin.

Ca marche nickel.

Merci aussi les pour les excellent cours et tutoriels pour apprendre Javascript : http://javascript.developpez.com/cours/ :ccool:

Merci pour votre aide.
RollinGStaR95