SORU
2 HAZİRAN 2010, ÇARŞAMBA


Fark arasında bir WordPress kullanmak``, `` fonksiyonları (örnek)`, `canlı`,``, `tetik` ve `temsilci bağlama tıklayın?

jQuery official website, her işlevin belgeleri okudum ama listeleri aşağıda işlevleri arasında: böyle bir karşılaştırma yok

$().click(fn)
$().bind('click',fn)
$().live('click',fn)
$().delegate(selector, 'click', fn)
$().trigger('click') // UPDATED
$().on('click', selector ,fn); // more UPDATED

Herhangi bir başvuru linki kaçının.

Nasıl fonksiyonları tam olarak çalışıyor yukarıda ve tercih edilmesi gereken, hangi durumda?

Not:Eğer herhangi bir diğer işlev(ler) aynı işlevi veya mekanizma yaşıyorsanız, O zaman ayrıntılı lütfen.

Güncelleme

Ayrıca $.trigger bir fonksiyon gördüm. Yukarıdaki fonksiyonları benzer çalışır?

Daha Fazla Güncelleme

Şimdi .on eklediv1.7ve bu da bir şekilde yukarıdaki işlevleri gereği birlikte kapak bence.

CEVAP
2 HAZİRAN 2010, ÇARŞAMBA


Sen bunu okurken, pull this list of events up in another page, the API itself is tremendously helpful, and all of what I'm discussing below is linked directly from this page önce.

İlk olarak, 47* *tam anlamıyla .bind('click', function) için bir kısayol eşdeğer. Bir işleyici bağlamabir öğe için doğrudanbu: gibi

$(document).click(function() {
  alert("You clicked somewhere in the page, it bubbled to document");
});

Eğer bu eleman ya da dışarıda yerine atılmış, bu işleyici artık orada olmayacak. Ayrıca orada olmayan unsurlarbu kodu çalıştırdığınızdaişleyicisi (örneğin seçici sonra buldum) eklemek işleyicisi götürmez.

.live() .delegate() benzer ilgili, .delegate() aslında .live() DAHİLİ olarak, onlar olayları dinleyebilir hem de kullanır kabarcık.Bu eski ve yeni öğeler için çalışıronlar olayları aynı şekilde kabarcık. Öğeleri, örneğin yeni satır, liste öğeleri, vb ekleme değişebilir zaman bu kullanın. Eğer sayfa içinde kalmak ve herhangi bir noktada değiştirilmesi değil, ortak ata/bir ebeveyn yok eğer doğru değilse, bu gibi .live() kullanın:

$(".clickAlert").live('click', function() {
  alert("A click happened");
});

Ancak yerini almıyor ki ana öğe bir yerde olay işleyicileri güle güle gitmiyor ... () varsa bu gibi .delegate() ile idare etmelisiniz:

$("#commonParent").delegate('.clickAlert', 'click', function() {
  alert("A click happened, it was captured at #commonParent and this alert ran");
});

Bu .live() ama olay yakalanmadan daha az zaman kabarcıklar ile hemen hemen aynı çalışır ve işleyicileri idam edildi. Bunların her ikisi de diğer bir yaygın kullanımı, sınıf bir öğe üzerinde değişiklik, artık başlangıçta kullanılan seçici eşleşen ki...bu yöntemler ile seçici değerlendirilirolay sırasındaeğer eşleşirse, işleyici çalışır...bu eleman artık seçici konularda uyan artık idam olmayacak. .click() ancak, olay işleyicisi bağlı sağdaki DOM element, aslında o değil maç ne olursa olsun seçici kullanıldı bulmak için bu alakasız...olaydır bağlı ve kalmak kadar o eleman gitti, ya da işleyicisi kaldırılır) .unbind().

.live() .delegate() için henüz başka bir ortak kullanınperformans. İle uğraşıyoruzçokelementler, doğrudan her öğe için tıklatın işleyicisi ekleme pahalı ve zaman alıcıdır. Bu gibi durumlarda kurulum için daha ekonomiktekişleyici ve köpürme çalışma yapalım, take a look at this question where it made a huge difference uygulamanın iyi bir örnek.


Tetikleme- güncelleştirilmiş bir soru

Olay işleyicisi 2 ana fonksiyonları kullanılabilir tetikleme, they fall under the same "Event Handler Attachment" category in the API, bu .trigger() .triggerHandler(). .trigger('eventName') bazı kısayollar yerleşik, örneğin: ortak olaylar vardır

$().click(fn); //binds an event handler to the click event
$().click();   //fires all click event handlers for this element, in order bound

You can view a listing including these shortcuts here.

Fark olarak, .trigger() olay işleyicisi (ama tıklandığında doğru noktada varsayılan eylemi çoğu zaman, örneğin imleç yerleştirme <textarea>) tetikler. Olay işleyicileri bağlı olduklarını sırayla gerçekleşmesi için yerel olay olurdu) neden, yerel olay eylemleri yangınları, DOM kabarcıklar.

.triggerHandler() genellikle farklı bir amaçla burada sadece ilişkili işleyicisi(s) ateş etmeye çalışıyorsun, yangın için yerel olay neden olmaz, örneğin form gönderme. Yukarı DOM balon değil, chainable (bu olay için son bağlı olay işleyicisi döndürdükleri döner) değil. Örneğin eğer istersen bir tetik focus olay değil aslında odak nesne, sen sadece kodu bağlı .focus(fn) çalıştırmak için, bunu yapmak istiyorsunuz, oysa .trigger() böyle bir şey yapar gibi aslında odak unsuru ve kabarcık.

İşte gerçek dünya örneği:

$("form").submit(); //actually calling `.trigger('submit');`

Bu jQuery validation plugin <form> göndermek için deneyin, herhangi bir teslim işleyicileri, örneğin çalışır. Bununla birlikte eğersadecesubmit olay işleyicisi ile bağladım ama <form> göndermemesini beri doğrulamak istedim, daha sonra, bu gibi .triggerHandler('submit') kullanabilirsiniz:

$("form").triggerHandler('submit');

Eklenti eğer doğrulama denetimi başarılı değilse bile bombalayarak formu göndererek dışarı işleyicisi engeller, ancak bu yöntem ile ne yaptığı umurumuzda değil. Bu iptal olsun ya da olmasın değilizçalışıyorformu göndermek için yeniden doğrulamak için tetikleyici ve başka bir şey yapmak istedim. (Yasal Uyarı:Bu eklenti, ama niyet iyi bir resim) .validate() bir yöntem olduğundan gereksiz bir örnektir

Bunu Paylaş:
  • Google+
  • E-Posta
Etiketler:

YORUMLAR

SPONSOR VİDEO

Rastgele Yazarlar

  • Christopher Bill

    Christopher

    30 NİSAN 2009
  • Kontor.TV

    Kontor.TV

    14 Mart 2006
  • New Scientist

    New Scientis

    27 Kasım 2006