jQuery

jQuery İpuçları - 5

Fatih Hayrioğlu

05 Kas 2013 — 3 min read

## event.preventDefault()

Eğer bu fonksiyon çağrıldı ise başlangıçta tetiklenen olay çalışmayacaktır. event.preventDefault() jQuery bağlantı kontrolü için sık sık başvurduğumuz bir metottur.

Bir örnek ile daha kolay açıklarız durumu

{% highlight html %} Tıkla{% endhighlight %}

Yukarıdaki gibi bir bağlantımız olsun. Biz bu bağlantıya müdahale edip bir işlem yaptırmak istediğimizde tarayıcı bunu bir bağlantı olarak gördüğü için href içindeki değeri uygulayacaktır. href içinde diyez(#) olduğundan sayfayı yukarı kaydıracaktır. Biz tarayıcının href değerini yorumlamasını durdurmak ve kendi işimizi yapmak için event.preventDefault() metodunu kullanırız.

{% highlight javascript %} $("a").click(function(e) { e.preventDefault(); // kendi işimizi yapalım } {% endhighlight %}

fonksiyona parametre olarak event(e) vererek e.preventDefault(); kısaltmasını kullanabiliyoruz. Bağlantı fonksiyonun ilk satırında olması önemli. Basit ama bilinmesi gereken bir konu.

## Her zamana son versiyonu çekmek için

jQuery sürümlerini güncellemek bazen sıkıntı olabiliyor. İlk jQuery ipuçları makalemde yazdığım

{% highlight javascript %}

$(document).ready(function() { //isler burada });

{% endhighlight %}

Koda bakarsak, jquery 1.2.6 sürümü çekiliyor. Bunun yerine her daim güncel bir jQuery sürümü çekmek için

{% highlight javascript %}

{% endhighlight %}

jQuery’nini kendi CDN son sürümü çekebiliyoruz.

Form elemanları sıfırlamak için

Bazen form elemanlarını sıfırlamak sorun olabiliyor. jQuery ile bir yöntem ararken stackoverflow’da gördüğüm bir cevabı not edeyim dedim.

{% highlight javascript %} function resetForm($form) { $form.find('input:text, input:password, input:file, select, textarea').val(''); $form.find('input:radio, input:checkbox') .removeAttr('checked').removeAttr('selected'); }

// kullanımı: resetForm($('#myform')); // id ile resetForm($('form[name=myName]')); // name ile {% endhighlight %}

kaynak: http://stackoverflow.com/questions/680241/blank-out-a-form-with-jquery

## popup penceresi açmak

Ey gidi eski günler. Ne popup kullanırdık. Şimdilerde çok nadir kullanılsa da ihtiyaç olduğu durumlar için basit bir yöntem gördüm ve paylaşayım dedim.

{% highlight javascript %} $('a.popup').live('click', function(){ newwindow=window.open($(this).attr('href'),'','height=200,width=150'); if (window.focus) {newwindow.focus()} return false; }); {% endhighlight %}

kaynak: http://www.jquery4u.com/windows/jquery-cleanly-open-links-popup-windows/

## textarea karakter sayımı

Kullanıcının yazdığı metin girdi alanlarına belli sayıda karakter girmesi istendiğinde girdi alanı üzerine, altına veya herhangi bir yanına bir sayaç koyarız. Bu işi jQuery ile yapmak gayet basit.

HTML kodu;

{% highlight html %} 0

{% endhighlight %}

jQuery Kodu;

{% highlight javascript %} $('textarea').bind('keydown keyup keypress change',function(){ var thisValueLength = $(this).val().length; $('.count').html(thisValueLength); }); {% endhighlight %}

kaynak: http://black-flag.net/jquery/20120229-3696.html

## Jquery Trim() sorunu ve çözümü

Son olarakta sizlerle karşılaştığım bir sorunu ve çözümünü paylaşmak istiyorum. Bir form elemanı değerini trim() fonksiyonu yardımı ile alıp kullandığım kodun bir kısmında ie8’de sorun yaşadım.

{% highlight javascript %} if($('#test').val().trim()!=''){ {% endhighlight %}