jQuery İpuçları - 5

5 Kasım 2013

## 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

<a href="#">Tıkla</a>

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.

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

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

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
<script type="text/javascript">
 $(document).ready(function() {
    //isler burada
 });
</script>

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

<script type="text/javascript"
src="http://code.jquery.com/jquery-latest.min.js" charset="utf-8">
</script>

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.

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

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.

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

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;

<span class="count">0</span>
<textarea name="textarea" rows="10" cols="30"></textarea>

jQuery Kodu;

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

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.

if($('#test').val().trim()!=''){

Message: Object doesn’t support this property or method

Hatasını veriyordu ie8, çözümü stackoverflow’da buldum. Yazılımcı dostu site sağ olsun tüm aradıklarımı buluyorum. Çözüm;

if($.trim($('#test').val()) != ''){

şeklinde yazınca sorun çözüldü.

kaynak: http://stackoverflow.com/questions/3439316/ie8-and-jquerys-trim

Bunların dışında gördüğüm güzel linkleri aşağıda kaynaklar bölümünde paylaştım. Her biri incelemeye değer.

Kalın sağlıcakla.

Kaynaklar

Daha fazla oku

CSS'de lightdark() fonksiyonuyla kolayca koyu / açık mod yazımı

CSS'de lightdark() fonksiyonuyla kolayca koyu / açık mod yazımı Devamını oku

field-sizing özelliği

05 August 2024 tarihinde yayınlandı.

Tarayıcı geliştirici araçlarında yakınlaştırma ve uzaklaştırma yapmak

10 June 2024 tarihinde yayınlandı.