Dalam membuat soal latihan, terkadang guru perlu memberikan contoh soal dan jawaban, dan agar lebih interaktif untuk berbagai input soal maka perlu dibuatkan programnya. Program paling sederhana menggunakan HTM dan Javacript. Link demonya dapat dilihat di Kalkulator Molaritas (blogchem.com)
Berikut contoh kode program mmenggunakan Javascript, beri nama molaritas.html:
<!DOCTYPE html>
<html>
<head>
<title>Kalkulator Molaritas</title>
<style>
table, td {
border: 1px solid #cccccc;
border-collapse: collapse;
padding: 5px;
}
</style>
</head>
<body>
<h1>Kalkulator Molaritas</h1>
<form>
<table>
<tr>
<td><label for=”massa”>Massa zat (gram): </label></td>
<td><input size =”5″ type=”text” id=”massa” name=”massa”></td>
</tr>
<tr>
<td><label for=”volume”>Volume pelarut (liter): </label></td>
<td><input size =”5″ type=”text” id=”volume” name=”volume”></td>
</tr>
<tr>
<td><label for=”molarmass”>Massa molar zat (gram/mol): </label></td>
<td><input size =”5″ type=”text” id=”molarmass” name=”molarmass”></td>
</tr>
<tr>
<td colspan=”2″><input type=”button” value=”Hitung” onclick=”hitungMolaritas()”></td>
</tr>
<tr>
<td><label for=”molaritas”>Molaritas (mol/L): </label></td>
<td><input size =”5″ type=”text” id=”molaritas” name=”molaritas” readonly></td>
</tr>
</table>
</form><script>
function hitungMolaritas() {
// ambil nilai input dari pengguna
var massa = document.getElementById(“massa”).value;
var volume = document.getElementById(“volume”).value;
var molarmass = document.getElementById(“molarmass”).value;// hitung molaritas
var molaritas = massa / (molarmass * volume);
var molaritas = molaritas.toFixed(2);// tampilkan hasil perhitungan pada form
document.getElementById(“molaritas”).value = molaritas;
}
</script>
</body>
</html>
Bisa juga diprogram dalam bahasa html dan PHP. Beri nama molaritas.php. Link demonya dapat dilihat di Kalkulator Molaritas (blogchem.com). Kode programnya dapat di-copy seperti berikut:
<!DOCTYPE html>
<html>
<head>
<title>Kalkulator Molaritas</title>
</head>
<body>
<h1>Kalkulator Molaritas</h1>
<form method=”POST”>
<table>
<tr>
<td><label for=”massa”>Massa zat (gram): </label></td>
<td><input size =”5″ type=”text” id=”massa” name=”massa”></td>
</tr>
<tr>
<td><label for=”volume”>Volume pelarut (liter): </label></td>
<td><input size =”5″ type=”text” id=”volume” name=”volume”></td>
</tr>
<tr>
<td><label for=”molarmass”>Massa molar zat (gram/mol): </label></td>
<td><input size =”5″ type=”text” id=”molarmass” name=”molarmass”></td>
</tr>
<tr>
<td colspan=”2″><input type=”button” value=”Hitung” onclick=”hitungMolaritas()”></td>
</tr>
<tr>
<td><label for=”molaritas”>Molaritas (mol/L): </label></td>
<td><input size =”5″ type=”text” id=”molaritas” name=”molaritas” value=”<?php echo isset($_POST[‘massa’]) && isset($_POST[‘volume’]) && isset($_POST[‘molarmass’]) ? ($_POST[‘massa’] / ($_POST[‘molarmass’] * $_POST[‘volume’])) : ”; ?>” readonly>
</td>
</tr>
</table>
</form><script>
function hitungMolaritas() {
// ambil nilai input dari pengguna
var massa = document.getElementById(“massa”).value;
var volume = document.getElementById(“volume”).value;
var molarmass = document.getElementById(“molarmass”).value;// hitung molaritas
var molaritas = massa / (molarmass * volume);
var molaritas = molaritas.toFixed(2);// tampilkan hasil perhitungan pada form
document.getElementById(“molaritas”).value = molaritas;
}
</script>
</body>
</html>