Berikut adalah contoh program HTML sederhana untuk kalkulator beras:
<!DOCTYPE html>
<html>
<head>
<title>Kalkulator Beras</title>
</head>
<body>
<h2>Kalkulator Beras</h2>
<label for="harga">Harga Beras per Kg:</label>
<input type="number" id="harga" step="0.01"><br>
<label for="berat">Berat Beras (Kg):</label>
<input type="number" id="berat" step="0.01"><br>
<button onclick="hitungTotal()">Hitung Total</button>
<h3>Hasil:</h3>
<p id="total"></p>
<script>
function hitungTotal() {
var harga = document.getElementById("harga").value;
var berat = document.getElementById("berat").value;
var total = harga * berat;
document.getElementById("total").innerHTML = "Total harga: Rp " + total.toFixed(2);
}
</script>
</body>
</html>
Dalam contoh program di atas, kita memiliki dua input untuk memasukkan harga beras per kilogram (dalam angka) dan berat beras (dalam kilogram). Ketika tombol "Hitung Total" ditekan, fungsi hitungTotal() akan dijalankan.
Fungsi hitungTotal() mengambil nilai harga dan berat dari input, kemudian mengalikan keduanya untuk mendapatkan total harga beras. Hasilnya akan ditampilkan dalam elemen dengan id "total".
Pastikan untuk menyimpan kode tersebut dalam file dengan ekstensi .html, dan Anda dapat membukanya di browser untuk melihat kalkulator beras sederhana tersebut.