Html - CSS - XML - JavaScript - Ajax
Jquery $("#Element").On("Click","Button" ..... Firefoxta Çalışmıyor.
Jquery $("#Element").On("Click","Button" ..... Firefoxta Çalışmıyor.
-
Bir tane id si anaDiv olan bir div olsun. Sayfa yüklenince aşağıda gördüğünüz jquery kodlarını çağırıyorum.Sonra anaDiv içine dinamik olarak button ve onun içinede i elementi koyuyorum.
Jquery kodlarımız
$("#anaDiv").on("click","i", function () {
console.log($(this));
console.log($(this).parent());
$(this).parent().remove();
});
Örnek: Sayfanın son hali aşağıdaki gibi olsun 3 tane button ve i attık anaDiv içine bu durumda yukardaki jquery kodları chrome ve operada çalışıyor ancak firefox ve internet explorerda çalışmıyor.
Jquery versiyon = 1.12.4
<div id="anaDiv">
<button><i></i></button>
<button><i></i></button>
<button><i></i></button>
</div>
-
i yerine button denesen? consoleda hata çıkıyor mu?
-
Firefoxta button diyince oldu. İçerdeki i ye sınıf atıyorum.
$("#anaDiv").on("click",".sinif-adi", function () {
console.log($(this));
console.log($(this).parent());
$(this).parent().remove();
});
seklinde yapıyorum.O zaman yine olmuyor. Hiç fonksiyon içine girmiyo akış ordaki i de carpı işareti butonun sağ tarafında çarpı simgesi var ondan i ye bastırmaya calısıom.
-
$("#anaDiv button i").on("click",function () {
denesen olmaz mı?
-
Şimdi button ve i yi runtimeda ekleyeceğim için dediğin şekilde yaparsam sayfa yüklenince bakıyorki div içinde ne button var nede i var kimseye bişey eklemiyor. Ondan 1.seçiciye yazdığım kısmın sayfada en başından beri eklenmiş olması lazım.
Şu şekilde yapsam olur sanırım.
$("#anaDiv").on("click","button", function (event) {
// burda event.mouseKonumu gibi bi property ye bakarım.Eğer butonun sağ tarafına tıklanmışsa o zaman çarpıya basıldı sayarım.
console.log($(this));
console.log($(this).parent());
$(this).parent().remove();
});
-
$("i").click(function(){ console.log("hede"); });
denesene
-
sayfada henuz i elementi olmadığı için document.ready() de
$(
"i"
).click(
function
(){
console.log(
"hede"
);
});
bunu çağırsak kimseye olay eklenmemiş olur. Ama dinamik olarak ekledıkten hemen sonra dediğin gibi yapabılırım ben daha cok .on("click" ... seklinde nasıl yaparız diye dedim.Onuda pesimitzombie nin dediği biçimde button dediğim zaman oldu. -
Hannibal_King bunu yazdı
sayfada henuz i elementi olmadığı için document.ready() de
$(
"i"
).click(
function
(){
console.log(
"hede"
);
});
bunu çağırsak kimseye olay eklenmemiş olur. Ama dinamik olarak ekledıkten hemen sonra dediğin gibi yapabılırım ben daha cok .on("click" ... seklinde nasıl yaparız diye dedim.Onuda pesimitzombie nin dediği biçimde button dediğim zaman oldu.eskiden live ya da bind vardi simdi kaldirildi diye hatirliyorum
-
hackingo bunu yazdıHannibal_King bunu yazdı
sayfada henuz i elementi olmadığı için document.ready() de
$(
"i"
).click(
function
(){
console.log(
"hede"
);
});
bunu çağırsak kimseye olay eklenmemiş olur. Ama dinamik olarak ekledıkten hemen sonra dediğin gibi yapabılırım ben daha cok .on("click" ... seklinde nasıl yaparız diye dedim.Onuda pesimitzombie nin dediği biçimde button dediğim zaman oldu.eskiden live ya da bind vardi simdi kaldirildi diye hatirliyorum
live deprecated, yerine on kullanacaksınız
ozgunlu tarafından 30/May/16 13:19 tarihinde düzenlenmiştir -
Şimdi bir tane #anaDiv elementimiz var. Js ile bunun içine 3 tane <button><i></i></button> koyuyoruz. Bu eklenen buttonlara click olayını iliştirmek istiyoruz dimi?
Ben doğru anladım olarak kabul edip bir tane jsfiddle hazırlıyorum. Yanlış anlamışsam hemen yaz.
https://jsfiddle.net/vmh4psgy/1/
Edit Kodun Açıklanması: Şöyle ki html elementleri üzerinde değişiklik yaptığımı zaman -asenkron olaylar bunun dışında olmak üzere- hemen alttaki JS kodu çalıştırılmaz. İlk olarak html manipülasyonunun işlenmesi beklenir. O yüzden eklemeden hemen sonra olay atayabilirsiniz.
-
Senaryo : Bir div içine runtime sırasında button ekliyoruz, o buttonların içinede i elementi koyuyoruz. Bu i elementi aşağıdaki örnekte kırmızı bölge. Kullanıcı gelipte i elementine basarsa buton silinecek.
PcKO hocamın yazdığı örneği aşağıdaki gibi düzenledim.
https://jsfiddle.net/vmh4psgy/5/
İşte bu örneği chrome ve operada deneyin birde firefox ve internet explorer. İstenen şey ortadaki kırmızıya basınca butonun kaybolması.Ancak firefox ve internet explorerda çalışmıyor.
Çözüm olarak pesimistzombie hocam button kullan dedi.Onu denedim o zaman oluyor.O zamanda i yi algılamıo butona basınca butonu siliyor ama olsun.
Diğer yöntem ise her elementi ekledıkten sonra .bind ile yada .click ile her elemente ayrı ayrı olay vermek şimdi bide onu deneyeyim.