jQuery Olayları

jQuery, olay işleme için özel olarak tasarlanmıştır.

jQuery olay fonksiyonları

jQuery olay işleme yöntemleri, jQuery'deki çekirdek fonksiyonlardır.

Olay işleme programı, HTML'de belirli olaylar olduğunda çağrılan yöntemlerdir. Terim, olayın 'tetiklenmesi' (veya 'tetiklenmesi') olarak sıkça kullanılır.

Genellikle jQuery kodunu <head> bölümündeki olay işleme yöntemlerine ekleriz:

Örnek

<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$("document").ready(function(){
  $("button").click(function(){
    $("p").hide();
  });
});
</script>
</head>
<body>
<h2>Bu, bir başlık.</h2>
<p>Bu, bir paragraf.</p>
<p>Bu, başka bir paragraf.</p>
<button>Beni tıkla</button>
</body>
</html>

Kişisel olarak deneyin

Yukarıdaki örnekte, düğmenin tıklama olayı tetiklendiğinde bir fonksiyon çağrılır:

$("button").click(function() {  // some code... } )

Bu yöntem tüm <p> elementlerini gizler:

$("p").hide();

Bağımsız dosyada olan fonksiyonlar

Eğer web siteniz birçok sayfa içeriyorsa ve jQuery fonksiyonlarınızın kolayca yönetilebilir olmasını istiyorsanız, jQuery fonksiyonlarınızı bağımsız .js dosyasına ekleyin.

jQuery'yi gösterirken, fonksiyonları doğrudan <head> bölümüne ekleriz. Ancak, bunları ayrı bir dosyaya yerleştirmek daha iyidir, örneğin (dosyayı src özelliği ile referans vererek):

Örnek

<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="my_jquery_functions.js"></script>
</head>

jQuery Adlandırma Çatışması

jQuery, $ işaretini jQuery'nin kısa adı olarak kullanır.

Bazı diğer JavaScript kütüphanelerindeki fonksiyonlar (örneğin, Prototype) da $ işaretini kullanır.

jQuery, bu sorunu çözmek için noConflict() adlı bir yöntem kullanır.

var jq=jQuery.noConflict()，$ işaretini kendi adınızla (örneğin, jq) değiştirmenize yardımcı olur.

Kişisel olarak deneyin

Sonuç

jQuery, HTML olaylarını işlemek için özel olarak tasarlanmıştır, bu yüzden aşağıdaki ilkelerden birine uymak, kodunuzu daha uygun ve daha kolay yönetilebilir hale getirir:

  • Tüm jQuery kodunu olay işlevlerine yerleştirin
  • Tüm olay işlevlerini belge hazır olay işleyicisine yerleştirin
  • jQuery kodunu ayrı bir .js dosyasına yerleştirin
  • Adlandırma çatışması varsa, jQuery kütüphanesini yeniden adlandırın

jQuery Olayları

Aşağıda, jQuery'de olay yöntemlerinin bazı örnekleri verilmiştir:

Olay Fonksiyonu Fonksiyonu bağlayın
$(document).ready(function) Fonksiyonu belge hazır olayına (belge yüklenirken) bağlayın
$(seçici).click(function) Fonksiyonu seçilen elementin tıklama olayına tetikleyin veya bağlayın
$(seçici).dblclick(function) Fonksiyonu seçilen elementin çift tıklama olayına tetikleyin veya bağlayın
$(seçici).focus(function) Fonksiyonu seçilen elementin odaklanma olayına tetikleyin veya bağlayın
$(seçici).mouseover(function) Fonksiyonu seçilen elementin fare üzerine gelme olayına tetikleyin veya bağlayın

Tam referans kılavuzu için, sitemizi ziyaret edin jQuery Olay Referans Kılavuzu。