Skip to content

jQuery ile yeni elementlere müdahale

Diyelim ki sitenizde jQuery kullanarak bazı elementleri sayfa açılışında değiştiriyorsunuz. Örneğin;

jQuery(document).ready(function() {  	
	jQuery("img.avatar").parent("a").addClass("thumbnail pull-left"); 
});

Herşey güzel görünüyor sorun yok derken bir baktınız ki ajax kullanarak site içinde değişiklik yaptığınız zaman yeni eklenen içeriğe sayfa açılışında yaptığınız değişiklikler uygulanmıyor. Ve işin kötüsü jQuery ile yeni eklenen elementlere müdahale edemiyorsunuz çünkü o elementler sayfa açılışında orada değildi.

Why doesn’t an event work on a new element I’ve created?
As explained in the previous question about AJAX, events are bound only to elements that exist at the time when you issue your initial jQuery call. When you create a new element, you must bind the event to it separately, or use event delegation. jQuery F.A.Q

Peki çözümü nedir? Yapmak istediğiniz değişiklikleri bir function altında toplayıp bu function‘ı hem sayfa açılışında hem de “DOMNodeInserted” olduğu zaman yani yeni bir element siteye eklendiği zaman çağırmak gerek. Örneğin;

jQuery(document).ready(function() {
	firmasite_social_edits();	
});
jQuery(document).on("DOMNodeInserted", function(){
	firmasite_social_edits();
});
function firmasite_social_edits(){
	jQuery("img.avatar").parent("a").addClass("thumbnail pull-left"); 
}

Leave a Reply

Your email address will not be published. Required fields are marked *