Sunum yükleniyor. Lütfen bekleyiniz

Sunum yükleniyor. Lütfen bekleyiniz

Javascriptte Olay Fonksiyonları (Events). onMouseOver, onMouseOut Javascript dünyasında en çok kullanılan iki “event” varsa, birincisi Mouse işaretçisinin.

Benzer bir sunumlar


... konulu sunumlar: "Javascriptte Olay Fonksiyonları (Events). onMouseOver, onMouseOut Javascript dünyasında en çok kullanılan iki “event” varsa, birincisi Mouse işaretçisinin."— Sunum transkripti:

1 Javascriptte Olay Fonksiyonları (Events)

2 onMouseOver, onMouseOut Javascript dünyasında en çok kullanılan iki “event” varsa, birincisi Mouse işaretçisinin bir nesnenin üzerine gelmesi (“MouseOver” olayı), ikincisi ise Mouse isaretçisinin bir nesnenin üzerinden çekilmesi (“MouseOut” olayı) sayılabilir. Bu iki olayı onMouseOver ve onMouseOut yönlendiricileri ile karşılayabiliriz. Gerçekte bu iki olayla, Mouse isaretçisi bir bağlantı satırı veya grafiğinin ve bir grafik haritasının (Map, Area) üzerine geldiği veya üzerinden çekildiği zaman ilgilenebiliriz; çünkü diğer HTML unsurları ve Javascript nesneleri ile Mouse isaretçisinin işaretleme ilişkisi yoktur. Bu olayı ve yönlendirilmesini, şu küçük programda görebiliriz:

3 onMouseOver, onMouseOut Örneği function faregelince() { window.status = "En guzel site icin burayi tiklayin!"; return true } function faregidince() { window.status = "En guzel siteye gitme firsatini kacirdiniz!" return true } PC World-Türkiye

4 onFocus, onBlur Bilgisayarda bir program açıkken, Mouse ile programın başlık çubuğunu tıklayın; çubuğun renginden işletim sisteminin dikkatinin bu programın penceresinde yoğunlaştığını göreceksiniz. Bir de masaüstünde boş bir yeri tıklayın; bu pencere sistemin odak noktası olmaktan çıkacaktır. HTML sayfasında da Browser’in Focus’unu (dikkat odağını) üzerinde topladığı veya odağın çekildiği üç nesne olabilir: Text (Metin), Textarea( Metinalanı) ve Select(Seç) etiketleri. Çünkü ziyaretçinin sadece bu etiketlerin oluşturduğu nesnelere klavyenin dikkatini çekme hakkı vardır. Bu nesnelerden biri tıklanınca Browser’in focus’u bu nesneye dönmüş, yani “focus” olayı olmuş demektir; bu durumda, biz de bu olayı yönlendiren onFocus’u kullanabiliriz. Aynı mantıkla, ziyaretçi Browser’in focus’unu bu nesneden baska bir yere çektiği zaman bu nesne focus’u kaybeder, “blur” (netlikten çıkma, flulaşma) olayı olur. Bunu da onBlur ile yönlendiririz.

5 onFocus,onBlur function dogru() { document.form1.mesaj.value="Lütfen hata yapmayın!" } function sor() { document.form1.mesaj.value="isminiz alındı" } Lütfen isminizi yazınız!

6 function goster() { document.isimForm.ad.value="Adiniz kayda gecmistir." } function uyar() { document.isimForm.ad.value="Lutfen yanlislik yapmayiniz!" } Lütfen adinizi yazin ve sayfa üzerinde baska bir yeri tiklayin: Simdi de asagidaki kutuya mesleginizi yazin:

7 onFocus, onBlur Javascript, üstteki kutuya adınızı yazdıktan sonra başka bir yeri tıkladığınızda olan iş, “ad” isimli metin kutusunun “blur” olayına onBlur’un çağırdığı goster() fonksiyonu ile; alttaki kutuyu mesleğinizi yazmak üzere tıkladığınız anda “meslek” kutusunda olan “focus” olayına da uyar() fonksiyonu ile karşılık veriyor.

8 Formun unsurları Şimdi bir form içeren sayfa örneği yapalım; Javascript ile formun tamamen doldurulmuş olup olmadığını sınayalım. Böylece ziyaretçinin göndereceği formun eksik olduğunu anlamakta geç kalmamış oluruz. Aşağıdaki kodu kaydedip, Browser’da bir yerini eksik olarak doldurup formu göndermeyi deneyin.

9 function btnCheckForm_onclick() { var myForm = document.form1; if (myForm.txtAge.value == "" || myForm.txtName.value == "") { alert("Please complete all the form"); if (myForm.txtName.value == "") { myForm.txtName.focus(); } else { myForm.txtAge.focus(); } else { alert("Thanks for completing the form " + myForm.txtName.value); }

10 function txtAge_onblur() { var txtAge = document.form1.txtAge; if (isNaN(txtAge.value) == true) { alert("Please enter a valid age"); txtAge.focus(); txtAge.select(); } function txtName_onchange() { window.status = "Hi " + document.form1.txtName.value; } Please enter the following details: Name: Age:


"Javascriptte Olay Fonksiyonları (Events). onMouseOver, onMouseOut Javascript dünyasında en çok kullanılan iki “event” varsa, birincisi Mouse işaretçisinin." indir ppt

Benzer bir sunumlar


Google Reklamları