jQuery'de Tek Seferlik Olay

off metoduyla olayları kaldırmayı incelerken aşağıdaki yapıyı kullanmıştık:

$('li').on('click', function() {
	$(this).append('!');
	$(this).off('click', func);
});

Önce on ile bir işleyici fonksiyon ekliyorduk, sonra da off ile kaldırıyorduk.

jQuery'de kullanışlı bir one metodu bulunur - bu metod, yalnızca bir kez tetiklenecek ve ardından otomatik olarak kaldırılacak tek seferlik bir olay eklemenizi sağlar. Bu metod ilk parametre olarak olay türünü, ikinci parametre olarak da eklenen fonksiyonu alır.

Bir sonraki örneği aşağıdaki HTML koduna dayanarak inceleyeceğiz:

<ul>
	<li>text</li>
	<li>text</li>
	<li>text</li>
</ul>

CSS kodu şu şekilde:

li {
	width: 100px;
	cursor: pointer;
}

Şimdi her bir li'ye tek seferlik bir olay ekliyoruz:

$('li').one('click', function() {
	$(this).append('!');
});

Liste öğelerine tıklayın. Gördüğünüz gibi, one metodu sayesinde aynı etkiyi elde ettik.

Tüm bağlantılara şu olayı ekleyin: bağlantının üzerine gelindiğinde, metninin sonuna href değeri yuvarlak parantez içinde eklensin. Bağlantının üzerine ilk gelinmesinden sonra, metnin sonuna href ekleyen olay ondan kaldırılmalıdır.

Tüm input elemanları için, herhangi birine tıklandığında kendi value değerini yazdırmalarını sağlayın, ancak yalnızca ilk tıklamada. Input'a tekrar tıklanması bir tepki vermemelidir.

Sayılar içeren paragraflar verilmiştir. Bir paragrafa tıklandığında, içerdiği sayının karesi görünmelidir, ancak yalnızca ilk tıklamada. Bir paragrafa çift tıklandığında, içindeki sayı ikiye katlanmalıdır, ancak o da yalnızca ilk seferinde.

Paragraflar verilmiştir. Bir paragrafa ilk tıklandığında sonuna '!' eklensin, ancak yalnızca ilk tıklamada olsun.