ugrás a tartalomhoz

JQuery append,click avagy futásidő probléma

Apofiszh · 2009. Júl. 30. (Cs), 20.41
Sziasztok!

Olyan problémába ütköztem,hogy futás időben appendal egyik divből a másik divbe szeretnék pakolgatni html kódot, de valamiért az appendal létrehozott divekre a click esemény nem akar működni.

Hogy lehet futás időben előállított div-ekhez eseményt hozzárendelni?

Ha valaki tudja a választ legyen szíves ossza meg velem, köszönöm szépen előre is.

A kódom:

$(".egy_cimzett_nev").click(function(event){
event.preventDefault();
var ceg_id = $(this).parent().attr("id");
var nev = $(this).html();
$(".uj_uzenet_cimzettek_input").append('<div class="cimzett_add_sor" id="'+ceg_id+'"><div class="cimzett_add_neve">'+nev+'</div><div class="cimzett_x">X</div></div>');
$($(this).parent()).remove();

});

$(".cimzett_x").click(function(event){
event.preventDefault();
alert("lesz valami?");
var ceg_id = $(this).parent().attr("id");
var nev = $($(this).parent()+".cimzett_add_neve").html();
$(".uj_uzenet_cimzettek_lista").append('<div class="egy_cimzett" id="'+ceg_id+'"><div class="egy_cimzett_checkbox"><input type="checkbox"></div><div class="egy_cimzett_nev">'+nev+'</div></div>');
$($(this).parent()).remove();
});

Üdv A,
‹ Submit ne a lap tetejére dobjon Keresőbarát weblap kialakítása ›
 ■
1

Append + esemény

Poetro · 2009. Júl. 30. (Cs), 22.30
$('#valami').append(
  $('<div>Kattanj ra</div>').click(function () { 
    alert('Rakattantal');
  })
);
2

Nekem nem megy

Apofiszh · 2009. Júl. 30. (Cs), 22.59
$(".egy_cimzett_nev").click(function(event){
		event.preventDefault();
		var ceg_id = $(this).parent().attr("id");
		var nev = $(this).html();
		$(".uj_uzenet_cimzettek_input").append('<div class="cimzett_add_sor" id="'+ceg_id+'"><div class="cimzett_add_neve">'+nev+'</div>'+$('<div class="cimzett_x">X</div>').click(function(event){
		event.preventDefault();
		alert("lesz valami?");
		var ceg_id = $(this).parent().attr("id");
		var nev = $($(this).parent()+".cimzett_add_neve").html();
		$(".uj_uzenet_cimzettek_lista").append('<div class="egy_cimzett" id="'+ceg_id+'"><div class="egy_cimzett_checkbox"><input type="checkbox"></div><div class="egy_cimzett_nev">'+nev+'</div></div>');
		$($(this).parent()).remove();
	})+'</div>');
	
		$($(this).parent()).remove();
	});
4

akkor bontsd szét először

Ustak · 2009. Júl. 30. (Cs), 23.10

var x_div = $('<div class="cimzett_x">X</div>');
x_div.click(function(){alert("nohát")});
//egyéb blabla;
$(".uj_uzenetek_input_nak_az_a_resze_ahova_akarod_de_mar_legyen_benne_a_DOM_ban").append(x_div);
valahogy így:-)
Üdv:
Gábor

Ui:(Tudom hogy szennyezzük a globális névteret, tudom hogy lehetne closure -ban, stb stb :-))
3

Így van

Ustak · 2009. Júl. 30. (Cs), 23.02
A #cimzett_x divet a click-ed hozza létre, mikor az interpreter végigszalad a kódon, nem talál #cimzett_x divet (mert még nincs) és nem is köt ezért hozzá eseményt.
Másik hasonló mókás dolog az ajax töltés, mikor a kódban az ajax hívás hiába van "előtte" az ajax eredményét használó kódnak, honnan tudjuk, hogy vajon "megjön" -e addigra :-) Ezek mókás becsapós dolgok.
Üdv:
Gábor.
5

[object Object]

Apofiszh · 2009. Júl. 30. (Cs), 23.51
	$(".egy_cimzett_nev").click(function(event){
		event.preventDefault();
		var ceg_id = $(this).parent().attr("id");
		var nev = $(this).html();
		var div_x = $('<div class="cimzett_x">X</div>');
		div_x.click(function(event){
			event.preventDefault();
   			$(".uj_uzenet_cimzettek_lista").append('<div class="egy_cimzett" id="'+ceg_id+'"><div class="egy_cimzett_checkbox"><input type="checkbox"></div><div class="egy_cimzett_nev">'+nev+'</div></div>');
			$($(this).parent()).remove();
			alert("aaa");
		});
		
		$(".uj_uzenet_cimzettek_input").append('<div class="cimzett_add_sor" id="'+ceg_id+'"><div class="cimzett_add_neve">'+nev+'</div>'+div_x+'</div>');
		$($(this).parent()).remove();
	});
a X tartalmú div nem jön létre helyette azt írja,h [object Object] de az előtte lévő divet a névvel jól átírja
7

Nem jön létre?

Poetro · 2009. Júl. 31. (P), 00.23
Létrejön, csak nem szúrod be a fába, ezért nem jelenik meg. Valamihez hozzá kellene adni a div_x-et, hogy meg is jelenjen.
8

Hogy?

Apofiszh · 2009. Júl. 31. (P), 00.31
Hogy kell beszúrni a fába? és milyen fába?
Ilyen mélységében még nem foglalkoztam a jQueryvel:(
9

beszúrás

Poetro · 2009. Júl. 31. (P), 00.46
$(".uj_uzenet_cimzettek_input").append(
  $('<div class="cimzett_add_sor" id="'+ ceg_id +'"><div class="cimzett_add_neve">'+ nev +'</div></div>').find('.cimzett_add_sor').append(div_x);
);
10

Semmi

Apofiszh · 2009. Júl. 31. (P), 01.01
$(".egy_cimzett_nev").click(function(event){
		event.preventDefault();
		var ceg_id = $(this).parent().attr("id");
		var nev = $(this).html();
		var div_x = $('<div class="cimzett_x">X</div>');
		div_x.click(function(event){
			event.preventDefault();
   			$(".uj_uzenet_cimzettek_lista").append('<div class="egy_cimzett" id="'+ceg_id+'"><div class="egy_cimzett_checkbox"><input type="checkbox"></div><div class="egy_cimzett_nev">'+nev+'</div></div>');
			$($(this).parent()).remove();
			alert("aaa");
		});
		
  		var valami = '<div class="cimzett_add_sor" id="'+ceg_id+'"><div class="cimzett_add_neve">'+nev+'</div></div>';
		$(".uj_uzenet_cimzettek_input").append(valami).find('.cimzett_add_sor').append(div_x);
		$($(this).parent()).remove();
	});
mostmár le se másolja a "név" divet se,jóformán csak a remove része működik most
11

bocs

Apofiszh · 2009. Júl. 31. (P), 01.07
bocsi, működik, késő van már benéztem vmit

köszi szépen!,
már csak azt kell megoldani,h az "x"re visszapakoltat megint át tudjam pakolni :)
12

Nem ismerem

Ustak · 2009. Júl. 31. (P), 09.04
a problémádat teljesen, de nem lenne egyszerűbb a .hide() .show() .animate() stb függvényekkel már meglévő, de (kezdetben) css display:none tulajdonsággal rendelkező diveket feltölteni, pakolgatni, elrejteni, mutogatni? a .text() vagy .html() függvénnyekkel rakhatsz meg vehetsz el belőlük tartalmat. Így a divek már eleve benne vannak a Dom (Document Object Model) fában, így az $() selector megtalálja őket, és nem ütközöl ilyen problémákba. Aztán később mikor javascript ninja leszel, bonyolítod :-)
Üdv:
Gábor.
13

Én is

Apofiszh · 2009. Júl. 31. (P), 10.25
Erre gondoltam én is de olyan egyszerűnek tűnt , ezért a nehezebbet választottam, így tanultam újat is :)
6

live

duplabe · 2009. Júl. 31. (P), 00.13
nezz korul a live oldalan: http://docs.jquery.com/Events/live
14

Bár már megvan a megoldás,

yaanno · 2009. Júl. 31. (P), 17.46
Bár már megvan a megoldás, azért tényleg érdemes megnézni az oldalt; ha másért nem, akkor azért, hogy onnan eljuss az event delegation-höz. Érdemes kihasználni ezt az egyszerű lehetőséget.
15

Nagyon jó cikk

Ustak · 2009. Júl. 31. (P), 21.39
és tényleg a fenti probléma legjobb megoldása lenne!
Béke:
Gábor.