jQuery Button wechseln

[MsWord]

Hallo,


ich habe mir ein kleines Script zu Button wechseln gebaut.

Leider funktioniert es nur so halb, denn das erste mal wechseln funktioniert,
nur das "zurück" wechseln funktioniert nicht, d.h. er wechselt das nur einmal.
Warum weiß ich leider nicht, ich habe schon so viel ausprobiert...

Start-Button

<a class="right gig-gray-link change" href="#" id="hmchangebutton" data-typ="old" onclick="hgigliste('&t=old')">vergangene Gigs</a>

$(document).ready(function(){
	$('#hmchangebutton').on('click', function(){
		if($(this).data("typ") == 'old'){
			var newbutton = '<a class="right gig-gray-link change" data-typ="new" id="hmchangebutton" href="#" onclick="hgigliste(\'\')">aktuelle Gigs</a>';
		}
		if($(this).data("typ") == 'new'){
			var newbutton = '<a class="right gig-gray-link change" data-typ="old" id="hmchangebutton" href="#" onclick="hgigliste(\'&t=old\')">vergangene Gigs</a>';
		}
		
		$(this).closest(".gig-div-text").append(newbutton);
		$(this).remove();
	});
});

Hat jemand Ahnung was ich ändern muss?

 

[CPoly]

Du bindest das click event an dieses element "$('#hmchangebutton')". Und genau dieses Element löschst du später mittels "$(this).remove()". Kein wunder, dass du nie wieder ein click event empfängst.

 

[MsWord]

Ich habe mich nun etwas informiert und einen andern Weg gefunden,
nur leider weißt dieser auch noch ein par schwachstellen auf

Leider funktioniert auch diese Lösung nur ein mal.
D.h. er wechselt aber neu einmal.

Siehe hier: http://jsbin.com/epiyok/1

$(document).ready(function(){
	$('#new-term').next().on('click', function(){
		if($(this).data("typ") == 'old'){
			var value = "aktuelle Gigs";
			var typ   = "new";
			var v     = "''";
		}
		if($(this).data("typ") == 'new'){
			var value = "vergangene Gigs";
			var typ   = "old";
			var v     = "'&t=old'";
		}
		
		//$(this).closest(".gig-div-text").append(newbutton);
		//$(this).remove();
		$(this).text(value);
		$(this).attr("onclick", nclick);
		$(this).attr("data-typ", typ);
		hgigliste(v);
	});
});

 

[CPoly]

Du änderst zwar das Attribut "data-typ", aber jQuery aktualisiert dadurch nicht magisch den Wert der als "data()" beim Element gespeichert ist. Das sind eigentlich zwei verschiedene Dinge.

Um den Wert zu aktualisieren, musst du ihn mittels "data(key, value)" setzen (genauer "$(this).data("typ", typ);").

Allerdings enthält dein Code zusätzlich noch Fehler (siehe Fehlerkonsole). Denn "nclick" ist unbekannt.

 

[MsWord]

Vielen Dank!
Jetzt funktioniert es bis auf ein par kleine Aufhänger ganz gut