Jquery click() Kullanımı – Jquery Fonksiyonlar
Merhaba, bu yazımda jquery de click() kullanımı hakkında bilgi verecek ve bir kaç örnek ile anlatmaya çalışacağım. Bir önceki jquery yazımda yine click() işlemine de yarayan Jquery on() kullanımı hakkında bilgiler ve örneklere sayfamda yer vermiştim.
Jquery click() adından da anlaşılacağı gibi tıklama olayıdır. Yani belirttiğiniz bir elemana (bu eleman bir buton, div, p veya resim de olabilir) tıkladığınızda işlem yaptırmanızı sağlar.
Örnek;
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 |
<!DOCTYPE html> <head> <title>scetinkaya.com - Jquery click() Kullanımı</title> </head> <body> <p> p tagına tıklandığında işlem yap! </p> <div> div tagına tıklandığında işlem yap! </div> <button>İşlem Yap ! </button> <br> <span class="tikla"> tikla class değerine sahip span tagına tıklandığında işlem yap !</span> </body> <script type="text/javascript" src="//code.jquery.com/jquery-3.3.1.min.js"></script> <script> $(document).ready(function(){ // p tagına tıklandığında işlem yap $("p").on("click", function(){ alert("p tagına tıklandı"); }); // div tagına tıklandığında işlem yap $("div").on("click", function(){ alert("div tagına tıklandı"); }); // butona tıklandığında işlem yap $("button").on("click", function(){ alert("butona tıklandı"); }); // tikla class değerine sahip span tagına tıklandığında işlem yap $(".tikla").on("click", function(){ alert("tikla class değerine sahip span tagına tıklandı"); }); }); </script> </html> |
Yukarıdaki kodu index.html olarak kaydedip çalıştırın ve ekranda çıkan yazılara tıklayarak çalışmayı test edin. Gördüğünüz gibi belirttiğimiz elemanların üzerlerine tıklandığında ekrana alert yani bastırdık. Jquery de click() metodu kullanımı oldukça kolay ve çok da sık kullanılır.
Jquery click() kullanımı bu şekilde, bir sonraki yazıda görüşmek üzere.