Event-Driven Dil
Javascipt event-driven bir dildir. Javascript kodları bir event(olay)
sonucu çalıştırılırlar. Bu olay sayfanın yüklenmesi, bir düğmenin
tıklanması, bir form elemanının aktif hale gelmesi vs.. olabilir. Bir
olay olduğunda programcı bu olayı yakalar ve istenen işlemler yapar.
onLoad-onUnload
onLoad sayfa yüklenir yüklenmez bir kod çağırmak için kullanılır.
onUnload ise sayfa kapatıldığı zaman bir işlem yapmak için kullanılır.
Aşağıda sayfa yüklenir yüklenmez hoşgeldiniz mesajı gösteren ve
kullanıcı sayfadan ayrılırken de güle güle mesajı gösteren bir örnek
görülmektedir. onLaod ve unLoad body tag'inin içinde olmalıdır.
Kod:
Bu sayfa onLaod ve onUnLoad testi için hazırlanmıştır.
onClick
OnClick bir düğme tıklandığında veya bir link tıklandığında bir işlem
yapmak için kullanılır. Onay ve seçenek kutuları içinde onClick
kullanılabilir. Aşağıda bir süğmeye tıklandığında merhaba mesajı veren
bir örnek görüyorsunuz.
Kod:
Bu sayfa onClick testi için hazırlanmıştır.
onMouseOver ve OnMouseOut
onMouseOver fare ile bir link üzerine gelindiğinde bir işlem yapmak
için kullanılır. OnMouseOut ise tam tersine fare link'in üzerinden
ayrıldığı zaman bir işlem gerçekleştirmek içindir. Aşağıda bir link'in
üzerine gelindiğinde hoşgeldin yazan bir örnek görülmektedir.
Kod:
Bu sayfa onMouseOver testi için hazırlanmıştır.
tıklamayın
onSubmit
Form bilgileri submit düğmesine tıklandığında form'un action
property'sindeki programa gönderilir. Eğer gönderme işleminden önce bir
işlem yapmak istiyorsanız form tag'in onSumbit property'sini
kullanacaksınız. Eğer form istediğiniz gibi doldurulmamışsa form
bilgilerini göndermeyebilirsiniz. Aşağıdaki örnekte form bir text
alanından oluşmakta. Eğer text alanı doldurulmamışsa form bilgisi
gönderilmemektedir.
Kod:
function check(aForm){
if(aForm.testText.value==""){
alert("Text Alanı Boş");
return false;
}else{
return true;
}
}
Submit event'i gerçekleştiğinde check fonksiyonu çağrılmaktadır.
Bu fonksiyon true gönderirse form bilgisi gönderilir. Eğer false
gönderirse fomr bilgisi gönderilmez. check fonksiyonu form'daki adı
testText olan textfield'dinin boş olup olmadığını kontrol ediyor. Eğer
boşsa alert ile bir mesaj gönderiyor ve textfield'in boş olduğunu
söylüyor.
onReset
Girilen Form bilgilerini temizlemek için kullanılan reset düğmesi
tıklandığında bir işlem yapmak istiyorsanız onReset kullanılır.
Aşağıdaki örnekte reset düğmesi koyuyoruz ve onReset olayında reset
işleminin yapaılacağını bildiren bir mesaj gösteriyoruz.
Kod:
function isReset(){
alert("formunuzu resetliyorum. İşlem bir kaç dakika sürebilir.");
return true;
}
isReset fonksiyonu sonuç olarak true gönderdiği için işlem gerçekleşmektedir.
onChange
Bir formda bir değişiklik yapıldığında bir işlem yapmak istiyorsanız
onChange property'sini kullanacaksınız. onChange özelliği ancak başka
bir yere focus'landığında çağrılır. Her harf girişinde çağrılmaz.
Aşağıdaki örnekte bir text alanına yazı girildikçe yazıyı status bar'da
gösteren bir örnek vardır. Yazıyı girip başka bir yere tıklarsanız
yazının statusbar'da yazılı olduğunu görürsünüz.
Kod:
function change(aTextField){
status=aTextField.value;
}
status window.status yerine kullanılabilir. Değişme olduğunda
change fonksiyonu çağrılmaktadır. Bu fonksiyona textdfield parametre
olarak gönderilir.
onFocus ve onBlur
Bir form elemanı tıklandığı focus'landığı zaman (aktif hale geldiği
zaman) bir işlem yapmak için onFocus kullanılır. Eğer bir eleman
focus'luğunu kaybettiğinde bir işlem yapmak istiyorsanız onBlur
kullanılır. Aşağıdaki örnekte textfield focus'landığı zaman
focus'landığını belirten bir mesaj, focus'luk özelliği kalkınca bunu
belirten bir örnek bulunmaktadır.
Kod:
function focusField(aTextField){
alert(aTextField.name+" is focused");
}
function blurField(aTextField){
alert(aTextField.name+" is blured");
}
Javascipt event-driven bir dildir. Javascript kodları bir event(olay)
sonucu çalıştırılırlar. Bu olay sayfanın yüklenmesi, bir düğmenin
tıklanması, bir form elemanının aktif hale gelmesi vs.. olabilir. Bir
olay olduğunda programcı bu olayı yakalar ve istenen işlemler yapar.
onLoad-onUnload
onLoad sayfa yüklenir yüklenmez bir kod çağırmak için kullanılır.
onUnload ise sayfa kapatıldığı zaman bir işlem yapmak için kullanılır.
Aşağıda sayfa yüklenir yüklenmez hoşgeldiniz mesajı gösteren ve
kullanıcı sayfadan ayrılırken de güle güle mesajı gösteren bir örnek
görülmektedir. onLaod ve unLoad body tag'inin içinde olmalıdır.
Kod:
Bu sayfa onLaod ve onUnLoad testi için hazırlanmıştır.
onClick
OnClick bir düğme tıklandığında veya bir link tıklandığında bir işlem
yapmak için kullanılır. Onay ve seçenek kutuları içinde onClick
kullanılabilir. Aşağıda bir süğmeye tıklandığında merhaba mesajı veren
bir örnek görüyorsunuz.
Kod:
Bu sayfa onClick testi için hazırlanmıştır.
onMouseOver ve OnMouseOut
onMouseOver fare ile bir link üzerine gelindiğinde bir işlem yapmak
için kullanılır. OnMouseOut ise tam tersine fare link'in üzerinden
ayrıldığı zaman bir işlem gerçekleştirmek içindir. Aşağıda bir link'in
üzerine gelindiğinde hoşgeldin yazan bir örnek görülmektedir.
Kod:
Bu sayfa onMouseOver testi için hazırlanmıştır.
tıklamayın
onSubmit
Form bilgileri submit düğmesine tıklandığında form'un action
property'sindeki programa gönderilir. Eğer gönderme işleminden önce bir
işlem yapmak istiyorsanız form tag'in onSumbit property'sini
kullanacaksınız. Eğer form istediğiniz gibi doldurulmamışsa form
bilgilerini göndermeyebilirsiniz. Aşağıdaki örnekte form bir text
alanından oluşmakta. Eğer text alanı doldurulmamışsa form bilgisi
gönderilmemektedir.
Kod:
function check(aForm){
if(aForm.testText.value==""){
alert("Text Alanı Boş");
return false;
}else{
return true;
}
}
Submit event'i gerçekleştiğinde check fonksiyonu çağrılmaktadır.
Bu fonksiyon true gönderirse form bilgisi gönderilir. Eğer false
gönderirse fomr bilgisi gönderilmez. check fonksiyonu form'daki adı
testText olan textfield'dinin boş olup olmadığını kontrol ediyor. Eğer
boşsa alert ile bir mesaj gönderiyor ve textfield'in boş olduğunu
söylüyor.
onReset
Girilen Form bilgilerini temizlemek için kullanılan reset düğmesi
tıklandığında bir işlem yapmak istiyorsanız onReset kullanılır.
Aşağıdaki örnekte reset düğmesi koyuyoruz ve onReset olayında reset
işleminin yapaılacağını bildiren bir mesaj gösteriyoruz.
Kod:
function isReset(){
alert("formunuzu resetliyorum. İşlem bir kaç dakika sürebilir.");
return true;
}
isReset fonksiyonu sonuç olarak true gönderdiği için işlem gerçekleşmektedir.
onChange
Bir formda bir değişiklik yapıldığında bir işlem yapmak istiyorsanız
onChange property'sini kullanacaksınız. onChange özelliği ancak başka
bir yere focus'landığında çağrılır. Her harf girişinde çağrılmaz.
Aşağıdaki örnekte bir text alanına yazı girildikçe yazıyı status bar'da
gösteren bir örnek vardır. Yazıyı girip başka bir yere tıklarsanız
yazının statusbar'da yazılı olduğunu görürsünüz.
Kod:
function change(aTextField){
status=aTextField.value;
}
status window.status yerine kullanılabilir. Değişme olduğunda
change fonksiyonu çağrılmaktadır. Bu fonksiyona textdfield parametre
olarak gönderilir.
onFocus ve onBlur
Bir form elemanı tıklandığı focus'landığı zaman (aktif hale geldiği
zaman) bir işlem yapmak için onFocus kullanılır. Eğer bir eleman
focus'luğunu kaybettiğinde bir işlem yapmak istiyorsanız onBlur
kullanılır. Aşağıdaki örnekte textfield focus'landığı zaman
focus'landığını belirten bir mesaj, focus'luk özelliği kalkınca bunu
belirten bir örnek bulunmaktadır.
Kod:
function focusField(aTextField){
alert(aTextField.name+" is focused");
}
function blurField(aTextField){
alert(aTextField.name+" is blured");
}