Pelajaran pertama ini untuk
mengakses isi dari teks input, yang mana terdapat nilai Panjang, Lebar dan saat di isi nilai Lebar, maka nilai luas sudah muncul.
Biasanya ini
pelajaran awal dari
programming kan sewaktu di kelas kelas, nah kali ini akan di uraikan dengan menggunakan HTML dan JavaScript.
Terdapat 3
event yang bisa digunakan di Input Textbox, yaitu :
- OnChange : ketika isi dari textbox berubah (menunggu penekanan ENTER)
- OnFocus : ketika mouse diklik didalam textbox
- OnKeyUp : ketika tombol keyboard yang ditekan dilepaskan.
Ok berikut kode programnya.Simpan dengan nama LuasPP.html
01 | < script type="text/javascript"> |
02 | function HitungPP(P,L){ |
08 | < form id="form1" name="frmhitung"> |
09 | Menghitung Luas Persegi Panjang< br /> |
10 | Panjang : < input name="panjang" type="text" id="panjang" /> |
12 | Lebar : < input name="lebar" type="text" id="lebar" onkeyup= "document.frmhitung.luas.value= HitungPP(parseFloat(document.frmhitung.panjang.value),parseFloat( document.frmhitung.lebar.value));"/> |
14 | Luas : < input name="luas" type="text" id="luas" onfocus="blur();" /> |
Kemudian jalankan dengan menggunakan browser mozila atau IE. Hasilnya bagaimana?
Pada event OnKeyup di Lebar, bisa juga diganti dengan OnChange. :)
penjelasan
1 | < script type="text/javascript"> |
2 | function HitungPP(P,L){ |
Merupakan pendefinisian JavaScript yang mana kita mendefinisikan fungsi HitungPP(P,L) dengan P merupakan kiriman nilai Panjang dan L merupakan kiriman nilai Lebar.
Return merupakan pengembalian hasil pemrosesan.
1 Lebar : < input name="lebar" type="text" id="lebar" onkeyup= "document.frmhitung.luas.value= HitungPP(parseFloat(document.frmhitung.panjang.value),parseFloat( document.frmhitung.lebar.value));"/>
Program di atas akan bekerja saat tombol dilepas. document.frmhitung.luas.value bermaksud untuk mengambil nilai luas di form frmhitung di document html.
parseFloat berguna untuk mengkonversikan nilai text ke bilangan float.