jQuery veri - queue() yöntemi

jQuery Veri Referans Kılavuzu

Örnek

Kuyruk uzunluğunu göster:

function showIt() {
  var n = div.queue("fx");
  $("span").text( n.length );      
  setTimeout(showIt, 100);
}

Kişisel olarak deneyin

Tanım ve kullanım

queue() yöntemi, eşleşen elemanlar üzerinde yürütülen fonksiyon kuyruğunu görüntüler veya işlemektedir.

Gramer

.queue(queueName)
Parametreler Açıklama
queueName Opsiyonel. Dizge değeri, dizge adını içerir. Varsayılan fx, standart etkisi dizgesidir.

Kuyruk operasyonu

queue() yöntemi, eşleşen elemanlar üzerinde yürütülen fonksiyon kuyruğunu işlemektedir.

Gramer

.queue(queueName,newQueue)
Parametreler Açıklama
queueName Opsiyonel. Dizge değeri, dizge adını içerir. Varsayılan fx, standart etkisi dizgesidir.

Ayrıntılı açıklama

Her element, bir veya daha fazla jQuery tarafından eklenen fonksiyon kuyruğuna sahip olabilir. Çoğu uygulama için, sadece bir kuyruk (fx adında) kullanılır. Kuyruk, eleman üzerinde asenkron olarak eylem sırasını çağırır ve programın çalışmasını durdurmaz. Tipik örnek, eleman üzerindeki çok sayıda animasyon yöntemini çağırmaktır. Örneğin:

$('#foo').slideUp().fadeIn();

Bu satır çalıştırıldığında, element hemen sürükleme animasyonuna başlar, ancak solma geçişi fx kuyruğuna yerleştirilir ve sadece sürükleme geçişi tamamlandıktan sonra çağrılır.

.queue() yöntemi, bu fonksiyon kuyruğunu doğrudan işlememizi sağlar. Geri çağrı fonksiyonlu .queue() yöntemi özellikle faydalıdır; bu, kuyruk sonuna yeni bir fonksiyon eklememizi sağlar.

Bu özellik, animasyon yöntemleri tarafından sağlanan geri çağrı fonksiyonları ile benzerdir, ancak animasyon sırasında geri çağrı fonksiyonu ayarlamak zorunda değilsiniz.

$('#foo').slideUp();
$('#foo').queue(function() {
  alert('Hareket tamamlandı.');
  $(this).dequeue();
});;

Bu eşdeğerdir:

$('#foo').slideUp(function() {
  alert('Hareket tamamlandı.');
);

Lütfen dikkat edin, .queue() ile fonksiyon eklerken, .dequeue() final olarak çağrılmasını sağlamalıyız, böylece bir sonraki kuyruktaki fonksiyon çalışabilir.

Örnek 1

Özel fonksiyonlara kuyruk işlemleri yapın:

$("document.body").click(function () {
  $("div").show("slow");
  $("div").animate({left:'+=200'},2000);
  $("div").queue(function () {
    $(this).addClass("newcolor");
    $(this).dequeue();
  });;
  $("div").animate({left:'-=200'},500);
  $("div").queue(function () {
    $(this).removeClass("newcolor");
    $(this).dequeue();
  });;
  $("div").slideUp();
);

Kişisel olarak deneyin

Örnek 2

Kuyruğu silmek için kuyruk dizisini ayarlayın:

$("#start").click(function () {
  $("div").show("slow");
  $("div").animate({left:'+=200'},5000);
  $("div").queue(function () {
    $(this).addClass("newcolor");
    $(this).dequeue();
  );
  $("div").animate({left:'-=200'},1500);
  $("div").queue(function () {
    $(this).removeClass("newcolor");
    $(this).dequeue();
  );
  $("div").slideUp();
);
$("#stop").click(function () {
  $("div").queue("fx", []);
  $("div").stop();
);

Kişisel olarak deneyin

jQuery Veri Referans Kılavuzu