Discussion :

[beejeridou]

Bonjour!
J'ai un plugin que je déclare comme ceci: $('a.ajaxLink').ajaxLink();

Dedans, j'aimerais y mettre un évènement live(). Le problème est qu'il ne fonctionne pas comme je veux.

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
$(this).live('click', function(e)
{
    alert('ne fonctionne pas, d\ailleurs cette alert ne sert à rien');
});
 
$(this).bind('click', function(e)
{
    alert('fonctionne! mais qu\'une seule fois, donc pas le droit à un rechargement ajax...');
});
 
$('a.ajaxLink').live('click', function(e)
{
    alert('fonctionne autant de fois qu\'il y a d\'occurences!');
});

Savez-vous pourquoi le $(this).live() ne fonctionne pas??? c'est trop bizarre!

[beejeridou]

J'ai trouvé la solution:

Dans mon plugin, j'avais mis

Code :

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

1
2
3
return this.each(function() 
{
}

A la place j'ai mis return this; à la fin... Du coup tout fonctionne impec. C'est bizarre quand même, si quelqu'un peut expliquer ce fonctionnement, je suis preneur.

[danielhagnoul]

Bonsoir

Ce n'est utile dans un plugin, les éléments du DOM qui appellent le plugin sont accessibles et les nouveaux éléments reçoivent leurs événements dans le plugin.

Exemple :

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
24
25
26
27
28
29
30
31
32
33
34
35
36
(function($){
	$.fn.dvjhExemple = function(options){
		var opts = $.extend(true, {}, $.fn.dvjhExemple.defaults, options);
 
		return this.each(function(i, item){
			// L'item existe toujours !
			// c'est lui qui appelle le plugin !
			$(item).click(function(){
				console.log(opts.param2);
			});
 
			// un nouvel élément
			// possède ses événements
			$("<img/>", {
				"src": "../images/imageTest.png",
				"click": function(e){
					console.log("clic sur l'image à ", new Date(e.timeStamp).toLocaleString());
					return false;
				},
				"mouseenter": function(e){
					console.log("le pointeur est sur l'image à ", new Date(e.timeStamp).toLocaleString());
					return false;
				},
				"mouseleave": function(e){
					console.log("le pointeur quitte l'image à ", new Date(e.timeStamp).toLocaleString());
					return false;
				}
			}).appendTo(item);
		});
	};
 
    $.fn.dvjhExemple.defaults = {
		param1: 1,
		param2: "hello"
	};
})(jQuery);

Code :

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

1
2
3
$(function(){
   $(".conteneur").dvjhExemple();
});