JQuery "görünür" olayı

Question

Uygulamam, DOM'a (belge) daha sonra çağrılan DOM'a bazı öğeler ekler. JQuery 1.9.0 kullanıyorum

Aşağıdaki örnek çalışıyor. Ancak, ekranda görüntülendiğinde bu işlevi yürütmek istiyorum. Bu amaç için herhangi bir olay göremedim. http://api.jquery.com/category/events/

Temel olarak tek bir sayfa uygulamasıdır, bu nedenle belgeye hazır bir kez çağrılır, ancak kullanıcı kullanıcı arayüzü ile etkileşime girdiğinde ekrana giren ve çıkan öğeler.

Answer 1

istediğiniz olabilir .ready() fonksiyonu:

$("#box-descr").fadeIn(1000, function(){ 
    console.log("I showed up"); 
}); 

---

Güncelleme:

$("#box-descr").ready(function(){ 
    console.log("I showed up"); 
}); 

veya bunu solma eğer @Jeff Tian 'ın comment

gibi

Etkinliği en yakın statik pa dosyasına devretmeniz gerekir. kiralamak veya böyle document için:

$(document).on("ready", "#box-descr", function(){ 
    console.log("I showed up"); 
}); 

Answer 2

Ben hedeflenen eleman DOM eklendiğinde size olayı tetikleyebilir eğer soruyorsun düşünüyorum. İstediğin bu değilse, bana haber ver. Eğer

aradığınız ne

$(document).on('click', '#box-descr', function(evt) { 
    console.log("I showed up"); 
}); 

// Later in your code you add the element to the DOM 
$('<div />', { id : 'box-descr' }).appendTo('body'); 

// Then trigger the click event for the added element 
$('#box-descr').trigger('click'); 

Umut Sen

$('<div />', { id : 'box-descr' }).appendTo('body').trigger('click'); 

Answer 3

Olaylar bu kısaltabilir güzel ama görünüm için hiçbir yerli olay olduğundan zaman bir, olaylar bilerek gerektirir öğe eklenir, böylece olay manuel olarak tetiklenebilir. Bir şeyin görünümünü test etmek için anketi kullanabilir ve görüntülendiğinde bir işlem yapabilirsiniz. Bu, kullanıcı girdisi, ajax veya diğer programlar gibi, denetiminizin dışına eklenen içerikler için harika çalışır.

setInterval(function() { 
    $('.my-element-class:not(.appeared)') 
     .addClass('appeared') 
     .each(function() { 
      console.log("here I am!") 
     }); 
}, 250); 

Bu, her ikinci sınıf adıyla bir elementin görünüm (veya tedarik başka seçici kriterler) için 4 kez kontrol edin ve yeni madde göründüğünde kod çalışacaktır. Bir öğe görüldüğünde, bu örneğin tekrar algılanmasını önlemek için .appeared sınıfı eklenir. Sadece bir görünüm için test etmek isterseniz, bunu basitleştirebilir ve algılamadan sonra anketi kapatabilirsiniz.

jQuery appear eklentisi bu tekniklerin etrafında inşa ve madde görünüm alanında ise yönelik testlerde gibi çok daha fazla seçeneğe sahip olması, ancak bunu istediğiniz tüm test birkaç öğeler için ise ekleniyor

var testAppearTmr = setInterval(function() { 
    if ($('.my-element-class').length) { 
     clearInterval(testAppearTmr); 
     console.log("here I am!") 
    } 
}, 250); 

Yukarıdaki kod, bir eklentiden çok daha tasarrufludur.