Clickevent auf img wird nicht gefeuert

Sarah1991 · 16. Januar 2016

Hallo,

ich füge ein div via JS hinzu:

JavaScript

if(numberOfCounts > 1){					$(".item--deleteBox").show();					$(".item--deleteBox").append("<span class='headline--deleteBox'>" + 					numberOfCounts + " Profile werden gel&ouml;scht?</span>" +					"<div class='row'><span class='column small-5'><img class='img--cancel' src='../img/delete.png'/></span>"+					"<span class='column small-5'><img class='img--deleteSuccess' src='../img/save.png'/></span></div>");				} else if(numberOfCounts == 1) {					$(".item--deleteBox").show();					$(".item--deleteBox").append("<span class='headline--deleteBox'>" + 					numberOfCounts + " Profil wird gel&ouml;scht?</span>" +					"<div class='row'><span class='column small-5'><img class='img--cancel' src='../img/delete.png'/></span>"+					"<span class='column small-5'><img class='img--deleteSuccess' src='../img/save.png'/></span></div>");				}

Nun möchte ich auf die images img--cancel und img--deleteSuccess jeweils ein clickevent feuern, was aber nicht funktioniert:

JavaScript

$(".img--cancel").on("click", function(){		alert("click");		$(".item--deleteBox").hide();		$(".img--check").removeClass("isSelected");		$(".custom--checkbox").hide();
	});

Die ganze FUnktion sieht so aus:

JavaScript

function deleteCustomer(){
	$(".nav__link--profileoverview.delete").on("click", function(){		if($(this).hasClass("firstTime")){			$(".custom--checkbox").show();			$(".nav__link--profileoverview.delete").removeClass("firstTime");			$(".nav__link--profileoverview.delete").addClass("secondTime");			$(".custom--checkbox").on("click", function(){				var target = $(this).children();				target.toggleClass("isSelected");				target.toggle();			});		} else {			$(".nav__link--profileoverview.delete").removeClass("secondTime");			$(".nav__link--profileoverview.delete").addClass("firstTime");			if($(".img--check").hasClass("isSelected")) {				var numberOfCounts = $(".img--check.isSelected").length;				if(numberOfCounts > 1){					$(".item--deleteBox").show();					$(".item--deleteBox").append("<span class='headline--deleteBox'>" + 					numberOfCounts + " Profile werden gel&ouml;scht?</span>" +					"<div class='row'><span class='column small-5'><img class='img--cancel' src='../img/delete.png'/></span>"+					"<span class='column small-5'><img class='img--deleteSuccess' src='../img/save.png'/></span></div>");				} else if(numberOfCounts == 1) {					$(".item--deleteBox").show();					$(".item--deleteBox").append("<span class='headline--deleteBox'>" + 					numberOfCounts + " Profil wird gel&ouml;scht?</span>" +					"<div class='row'><span class='column small-5'><img class='img--cancel' src='../img/delete.png'/></span>"+					"<span class='column small-5'><img class='img--deleteSuccess' src='../img/save.png'/></span></div>");				}
			} else {				$(".custom--checkbox").hide();			}		}	});	$(".img--cancel").on("click", function(){		alert("click");		$(".item--deleteBox").hide();		$(".img--check").removeClass("isSelected");		$(".custom--checkbox").hide();
	});}

Woran kann das liegen?

Danke und Grüße,
Sarah

wolf · 16. Januar 2016

Schau mal wie ich das in meinem beispiel wo es um die Liste ging gemacht hab ..
Hinzufügen, dann eventListener binden und dann diesen eine Funktion aufrufen lassen

Du solltest keine eventListener nur kurzzeitig binden wollen, das wird dir spätestens beim 2. aufruf der Funktion deleteCustomer() schwere Probleme bereiten!

Sarah1991 · 17. Januar 2016

Das mit der Liste habe ich ncoh etwas einfacher hinbekommen:

JavaScript

$(".custom--checkbox").on("click", function(){				var target = $(this).children();				target.toggleClass("isSelected");				target.toggle();			});

Du meinst vermutlich das hier ne:

JavaScript

list.$trash = $('.ListHeader button[data-action="do_delete"]', list.$wrapper);

JavaScript

$('.ListHeader button', list.$wrapper).on('click', function() {				list[$(this).attr('data-action')]();			});

Clickevent auf img wird nicht gefeuert

Jetzt mitmachen!

Teilen