.one()

.one( events [, data ], handler ) Dönen Değer : jQuery Nesnesi

Açıklama : Seçilen elemanlar için bir olay işleyici bağla. Olay işleyici her eleman ve her olay tipi için en fazla bir kez çalışır.

.one( events [, data ], handler ) Eklendiği Versiyon 1.1

events
Tip : String
Bir ya da boşluklarla ayrılmış daha fazla olay tipi adını içeren string. "click" veya "submit" ya da kullanıcı tanımlı olay gibi.

data
Tip : Düz Nesne
Olay işleyiciye event.data değişkeniyle verilecek olan veriler.

handler
Tip : Fonksiyon( Olay eventObject )
Olay tetiklendiğinde çalıştırılacak olan fonksiyon.

.one( events [, selector ] [, data ], handler ) Eklendiği Versiyon 1.7

events
Tip : String
Bir ya da boşluklarla ayrılmış daha fazla olay tipi adını ve opsiyonel namespace adını içeren string. "click" veya "keydown.myPlugin" gibi.

selector
Tip : String
Seçilmiş elemanların içindeki olayın iliştirileceği alt elemanları filtrelemek için bir seçici deyim. Eğer bu değer null ise ya da hiç verilmemişse olay seçili elemanlara her ulaştığında tetiklenir.

data
Tip : Herhangi bir şey
Olay işleyiciye event.data olarak kullanması için gönderilecek veri.

handler
Tip : Fonksiyon( Olay eventObject )
Olay tetiklendiğinde çalıştırılacak olan fonksiyon. sadece return false; satırı olan olay işleyiciler için sadece false değer verilebilir.

.one( events [, selector ] [, data ] ) Eklendiği Versiyon 1.7

events
Tip : Düz Nesne
Key olarak bir ya da boşluklarla ayrılmış daha fazla olay tipi adını ve opsiyonel namespace adını içeren string, value olrak ise olay işleyici fonksiyon verilen nesne.

data
Tip : Herhangi bir şey
Olay işleyiciye event.data olarak kullanması için gönderilecek veri.

.one() metodu kullanım teorisi bakımından .on() metodu ile aynıdır, tek farkı .one() metodu bir kez çalışır ve kendini iptal ederek bir daha olay tetiklenirse çalışmaz. Örneğin:

$( "#foo" ).one( "click", function() {
  alert( "Bu sadece bir kez gösterilecek." );
});

Kod çalıştırıldıktan sonra ID değeri foo olan elemana tıklanınca bir alert popup mesajı gösterilir, daha sonraki tıklamalar hiç bir şey yapmaz. Bu kod aşağıdaki ile aynı işi yapar.

$( "#foo" ).on( "click", function( event ) {
  alert( "Bu sadece bir kez gösterilecek." );
  $( this ).off( event );
});

Bir diğer deyişle normal bir olay işleyiciyi bağlarken .off() kullanarak sonraki tetiklenmeleri iptal etmekle aynı işi yapar.

Eğer ilk parametrede birden fazla olay adı boşlukla ayrılmış şekilde verilirse olay işleyici verilen her bir olay için birer kere çalışacaktır.

$( "#foo" ).one( "click mouseover", function( event ) {
  alert( "> " + event.type + " olayı oluştu!" );
});

Bu koda göre verilen her iki olay için birer kere olmak üzere alert popup 2 kere görünecektir. Biri elemanı tıklayınca click, diğeri elemanın üzerine gelince mouseover olayı sonucu olarak.

Örnekler:

Her bir <div>'e bir kerelik olaylar bağla.

<style>
   div {
      width: 60px; height: 60px;
      margin: 5px; float: left;
      background: green;
      border: 10px outset;
      cursor:pointer;
   }
   p {
      color: red; margin: 0;
      clear: left;
   }
</style>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<p>Yeşil karelerden birine tıklayın...</p>
<script>
   var n = 0;
   $( "div" ).one( "click", function() {
      var index = $( "div" ).index( this );
      $( this ).css({
         borderStyle: "inset",
         cursor: "auto"
      });
      $( "p" ).text( "index #" + index + " div tıklandı." +
         " Toplam " + (++n) + " tıklama." );
   });
</script>

Yeşil karelerden birine tıklayın...

Tüm paragraflara ilk kez tıklandığında içlerindeki yazıyı alert eden olay işleyici.

$( "p" ).one( "click", function() {
  alert( $( this ).text() );
});

Çoklu olay adında olayın her biri için bir kere tetiklenmesi.

<div class="count">0</div>
<div class="target">Hover/click me</div>

<script>
   var n = 0;
   $(".target").one("click mouseenter", function() {
      $(".count").html(++n);
   });
</script>

Hover/click me