Javascript ile Klavye Tuşu ile Div Açıp/Kapatmak

Az önce gördüğüm bir mail'de, mantık olarak gayet basit olan küçük Javascript örneği üzerine bir soru aldım;

Soru şöyle ki; klavyede bir tuşa basıldığında bir divi açmak veya kapatmak isteniyor.

Burada kullanacağımız özellikler onkeydown olayı ve keyCode tanımlayıcısı. Mantıksal olarak, keyCode'u istenilen tuş olan tuşa basıldığında, dom elementini manipüle edeceğiz.

Örneğimizde nasıl yapacağımızı görelim;

var divDurum = 0;
function ackapaDiv(){
  if(divDurum === 0){
    document.getElementById("div").style.display = "block";
    divDurum = 1;
  }else{
    document.getElementById("div").style.display = "none";
    divDurum = 0;
  }
}

function tusKontrol(e) {
    e = e || window.event;
    if(e.keyCode == 65){
      ackapaDiv();
    }
}

document.onkeydown = tusKontrol;

HTML içeriği;

<div id="div" style="display:none">
Div içeriği
</div>

Burada 65 keyCode değeri "a" tuşunu belirtir. Buna göre a tuşuna basıldığında divin durumuna göre div açılacak ya da kapanacaktır.

Yorumları Göster veya Yeni Yorum Yaz