öncelikle bilmeyen arkadaşlara kısaca sorundan bahsedeyim. Query ile sonradan istemci tarafında dinamik olarak oluşturacağınız elementlere hover, mouseover veya click gibi eventler atamaya çalıştığınızda jquery bunları algılamıyor. ve sizin oluşturduğunuz elementlere eventi uygulamıyor. yani en basiti$(“#seriler a”).hover(function(){alert(“hover”);}, function(){$(“#seriler a”).css(“color”,”#cccccc”);});
şöyle bir örnekte ilk olarka server tarafından gelen elementlerde sorun yokken kendimiz javascript ile oluşturduğumuz a elementinde aşağıdaki gibi bir döngü veya ajax sorgusundan dönen sonuçlarda. eventlar çalışmıyor.for (i=0;i‘+ src +’ | ‘;// alert( kelime.replace(“+”,” “) );kelime=””;}else{kelime+=seri.charAt(i);}}$(“#seriler”).html( linkler );
işte karşılaştığım bu sorun üzerine çok fazla araştırmam sonucunda bu işi gören bir plugin buldum. Bu Live Query ile html çıktısından sonra oluşturulan elementlere event atayabilirsiniz. ilk yazdığımız hover kodu bu dinamiklerde çalışmazken plugini çağırıp aşağıdaki şekilde dinamik elementlerdeki eventları çalıştırabilirsiniz.$(‘#seriler a’).livequery(function(){// use the helper function hover to bind a mouseover and mouseout event$(this).hover(function() {//hoverda yapılacak işlemlervar nm= $(‘#seriler a’).index(this);$(“#seriler”).css(“color”,”#333333″);$(“#seriler a:lt(“+(nm)+”)”).fadeTo(500,0.3);$(“#seriler a:gt(“+(nm)+”)”).fadeTo(500,0.3);}, function() {//rolloutta yapılacak işlemler$(“#seriler”).css(“color”,”#cccccc”);$(“#seriler a”).stop().fadeTo(200,1);});}, function() {// unbind the mouseover and mouseout events$(this).unbind(‘mouseover’).unbind(‘mouseout’);});
plugini farklı amaçlarla da kullanabilirsiniz. bu dinamik elementlere erişmek de bazen sıkıntı olabiliyor. plugin sayfasına gitmek için tıklayınız.demolar için tıklayınız