Halo semua, hari ini kita akan mempraktekkan bagaimana sih cara membuat kalkulator di dalam web :D sebelumnya kita telah membahas tentang bagaimana "Cara Membuat Penjumlahan Menggunakan Javascript". Sebenarnya cara kali ini hampir sama dengan penjumlahan sebelumnya, tapi ada sedikit perbedaan :D apakah itu? mari kita praktekkan sama - sama.
Pertama kita membuat file html terlebih dahulu, lalu ketikkan kode seperti gambar berikut ini :
Hasil dari koding diatas akan persis seperti ini :
Disini kita hanya membutuhkan 2 form textbox input untuk pengisian kedua nomor yang akan di jumlahkan, satu label hasil untuk output nya dan juga 4 button yang terdiri dari Penjumlahan, Pengurangan, Perkalian dan juga Pembagian. Untuk nama variable pada button bisa kalian ganti sesuka hati :D jika masih belum paham apasih var itu dan apa kegunaannya, bisa kalian kunjungi kembali post sebelumnya berjudul "Cara Membuat Input dan Output".
Selanjutnya mari kita membuat javascript nya, sekarang kita akan menulisnya di bagian body bukan lagi di bagian head, kenapa? Cara ini bertujuan untuk mempercepat proses pengerjaan suatu proses pada javascript. Jadi sekarang kita tuliskan kode berikut didalam body, bebas mau ditaruh dimana saja asal jangan di tengah - tengah kode inputan, bisa ditulis diatas nya atau dibawah nya, untuk kali ini saya mengetikkan kode javascript dibawah :
Disana kita melihat ada var bil1 dan var bil2, maksud dari kedua var tersebut adalah membuat variable yang bernama bil1 / bil2 dengan mengambil Element document dari id txtbil1 / txtbil2. Untuk var hasil diambil dari proses dari bil1 dijumlahkan oleh bil2, document.getElementById("lblhasil").innerHTML = hasil; maksud dari kode ini adalah mengambil dokumen dari elemen id lblhasil di didalam html, nantinya hasil dari penjumlahan tersebut masuk ke dalam label yang mempunyai id lblhasil.
Sekarang mari kita coba melihat hasil dari pengerjaan diatas.
Penjumlahan :
Pengurangan :
Perkalian :
Pembagian :
Nah, jadi kan kalkulator berbasis web yang kita buat? mudah kan ? jika masih ada eror atau ketidak pahaman bisa langsung tanyakan dikomen ya teman - teman.
See You Next Time Guys !!!
nunggu next tutornya om
BalasHapus