Pada contoh ini, akan dibuat semacam kalkulator sederhana yang mengoperasikan penjumlahan, pengurangan, perkalian dan pembagian dari dua buah bilangan
contoh
<html>
<head>
<script language="JavaScript" type="text/JavaScript">
function hitung()
{
var bilangan1 = parseFloat(document.formku.bil1.value);
var bilangan2 = parseFloat(document.formku.bil2.value);
var op = document.formku.operasi.value;
var hasil;
if (op == "jumlah") hasil = bilangan1 + bilangan2;
else if (op == "kurang") hasil = bilangan1 - bilangan2;
else if (op == "kali") hasil = bilangan1 * bilangan2;
else if (op == "bagi") hasil = bilangan1 / bilangan2;
document.formku.hasil.value = hasil;
}
</script>
</head>
<body>
<h1>Kalkulator Sederhana</h1>
<form name="formku">
Bil Pertama <input type="text" name="bil1">
<select name="operasi" onchange="hitung()">
<option value="jumlah">Dijumlahkan</option>
<option value="kurang">Dikurangkan</option>
<option value="kali">Dikalikan</option>
<option value="bagi">Dibagi</option>
</select>
Bil Kedua <input type="text" name="bil2"> =
<input type="text" name="hasil">
</form>
</body>
</html>
Pada contoh ini, hasil operasi akan muncul setelah user memilih jenis operasi yang diinginkan pada combobox. Untuk itu event yang digunakan pada contoh ini adalah onchange. Event tersebut diberikan pada combobox. Selanjutnya, perhatikan pada perintah var bilangan1 = parseFloat(document.formku.bil1.value);
var bilangan2 = parseFloat(document.formku.bil2.value); Mungkin Anda bertanya, mengapa harus ada parseFloat()? Jawabannya adalah karena apabila tidak menggunakannya, maka input value dari bilangan pertama dan kedua dianggap sebagai string. Sehingga apabila tidak menggunakan perintah parseFloat() akibatnya adalah mengoperasikan string. Misalkan akan menjumlahkan bilangan pertama adalah 5 dan bilangan kedua adalah 7, maka hasilnya adalah 57 (penjumlahan string).
Tidak ada komentar:
Posting Komentar