Takip Edin

JQUERY

Jquery Click Event Kullanımı

Jquery Click Event Kullanımı - Öne Çıkan Görsel

Bu bölümde, Jquery’de bulunan .click( ) event’iyle alakalı örnekler yapılmaktadır.

   $(document).ready(function() {
                console.log("click event");
           });

Aşağıdaki kod, üstteki document.ready( ) metodu ile aynı işlevi görür.

   $(function() { 
               console.log("click event");
           })
$(document).ready(function() {
            $("#p1").click(function() {
                alert("İlk paragrafa ait click event'i");
            });
        });
$(document).ready(function () {
            $("p").click(function () {
                alert("Tüm paragraflara ait click event'i");
            });
        });
$(document).ready(function() {
            $(".paragraf").click(function() {
                alert("paragraf class'ına ait click event'i");
            });
        });
$(document).ready(function() {
            $(".paragraf").click(function() {
                $(this).addClass("addattrtoparagraph"); 
            });
        });

paragraf class’ına sahip olan eleman üzerinde işlem yapmaya devam edileceğinden dolayı “this” ifadesi kullanıldı. “this”, o an tıklanılan paragrafın referansını tutmayı sağlar. Eğer $(this) yerine tekrar $(“.paragraf”) yazarsak class’ı “paragraf” olan herhangi bir elemana tıkladığımızda class’ı “paragraf” olan tüm elemanlara “addattrtoparagraph” sınıfı eklenecektir. “this”, bu durumun önüne geçmemizi sağlar.

Devamını oku

Popüler

error: Content is protected !!