Modifier l'action d'un bouton en jQuery

[Pecose]

Je veux modifié dynamiquement l'action d'un bouton:

Code : Tout sélectionner

$("#action1").click(function(){
$('.bouton').attr('id', 'action2');
//action specifique à l'action1			
});
			
$("#action2").click(function(){
$('.bouton').attr('id', 'action3');
//action specifique à l'action2				
});
			
$("#action3").click(function(){
$('.bouton').attr('id', 'action1');
//action specifique à l'action3				
});

Le bouton en question:

Code : Tout sélectionner

<input type="button" value="Valider" class="bouton" id="action1"/>

Je ne pence pas pouvoir utiliser de Toggle vu que j'ai plus de deux actions différentes sur le même bouton.

Le problème de ce code, c'est qu'a partir du deuxième bouton ca ne marche plus. Je pence que l'action2 n'est pas reconnu, n'existant pas dans le code d'origine...

Si vous avez une solution c'est avec plaisir.
Votre Navigateur : Mozilla/5.0 (Macintosh; Intel Mac OS X 10_7_5) AppleWebKit/537.17 (KHTML, like Gecko) Chrome/24.0.1312.57 Safari/537.17

[Ymai]

Bonjour

Le problème de ce code, c'est qu'a partir du deuxième bouton ca ne marche plus. Je pence que l'action2 n'est pas reconnu, n'existant pas dans le code d'origine...

J'ai dans l'idée que ce doit effectivement être le problème.
Une solution pourrait être du type suivant, utilisant la fonction "live":

Code : Tout sélectionner

  $(document).ready(function(){
    $("#action1").live('click', function(){
    $(this).attr('id', 'action2');
    alert('action1');
    });
             
    $("#action2").live('click', function(){
    $(this).attr('id', 'action3');
    alert('action2');
    });
             
    $("#action3").live('click', function(){
    $(this).attr('id', 'action1');
    alert('action3');
    });
	  })

J'ai aussi modifié le

Code : Tout sélectionner

$('.bouton').attr('id', 'action1');

dans la mesure où il me semblait peu orthodoxe qu'un objet avec une "class" attribue un "id". Il se pourrait que plusieurs objets aient la même "class" nommée ".bouton" (par nature des "classes"). Ce qui mènerait à plusieurs objets ayant le même "id" = hérétique.

http://jsfiddle.net/chX4v/

[edit]La date de péremption de ma réponse est dépassée. Il faut que je me mette à jour
As of jQuery 1.7, the .live() method is deprecated. Use .on() to attach event handlers. Users of older versions of jQuery should use .delegate() in preference to .live().
http://api.jquery.com/live/
Yapluka adapter[/edit]

[edit2]
Ceci devrait être mieux...
http://jsfiddle.net/GYrJc/

Code : Tout sélectionner

 $(document).ready(function(){
$('body').on('click','#action1', function(){
$('#action1').attr('id', 'action2');
alert('action1');
});
$('body').on('click', '#action2', function(){
$('#action2').attr('id', 'action3');
alert('action2');
});
$('body').on('click', '#action3', function(){
$('#action3').attr('id', 'action1');
alert('action3');
});
}) 

[/edit2]


Votre Navigateur : Mozilla/5.0 (X11; Ubuntu; Linux i686; rv:19.0) Gecko/20100101 Firefox/19.0

[stobag]

Je ne comprends pas bien le problème, ça serait plus facile si tu postais ton code sur jsbin.com ou jsfiddle.net.
Votre Navigateur : Mozilla/5.0 (Windows NT 6.1; WOW64; rv:18.0) Gecko/20100101 Firefox/18.0