Dengan menggunakan bahasa pemrograman web JavaScript, kita tidak hanya dapat menampilkan sebuah dokumen HTML seperti pada umumnya yaitu baik berupa teks, tabel atau gambar yang sifatnya statis, lebih dari itu kita juga dapat melakukan proses input dari keyboard serta melakukan perhitungan aritmatika seperti penjumlahan, pengurangan, perkalian, pembagian dan sebagainya dalam sebuah halaman web.
Dengan menambahkan beberapa fungsi pada script, user atau pengguna dapat melakukan perhitungan aritmatika dalam sebuah halaman web. Berikut ini merupakan sintaks untuk membuat "Kalkulator Web" menggunakan JavaScript :
<head><title>Kalkulator JavaScript</title></head>
<body>
<script language="JavaScript">;
function jumlah()
{
var bil1= parseFloat(document.luxury.bilangan1.value);
if (isNaN(bil1))
bil1=0.0;
var bil2= parseFloat(document.luxury.bilangan2.value);
if (isNaN(bil2))
bil2=0.0;
var hasil = bil1+ bil2;
alert("Hasil Penjumlahan = "+ hasil);
}
function kurang()
{
var bil1= parseFloat(document.luxury.bilangan1.value);
if (isNaN(bil1))
bil1=0.0;
var bil2= parseFloat(document.luxury.bilangan2.value);
if (isNaN(bil2))
bil2=0.0;
var hasil = bil1- bil2;
alert("Hasil Pengurangan = "+ hasil);
}
function kali()
{
var bil1= parseFloat(document.luxury.bilangan1.value);
if (isNaN(bil1))
bil1=0.0;
var bil2= parseFloat(document.luxury.bilangan2.value);
if (isNaN(bil2))
bil2=0.0;
var hasil = bil1* bil2;
alert("Hasil Perkalian = "+ hasil);
}
function bagi()
{
var bil1= parseFloat(document.luxury.bilangan1.value);
if (isNaN(bil1))
bil1=0.0;
var bil2= parseFloat(document.luxury.bilangan2.value);
if (isNaN(bil2))
bil2=0.0;
var hasil = bil1/ bil2;
alert("Hasil Pembagian = "+ hasil);
}
</script><form name="luxury">
<center>
<h3> Perhitungan Aritmatika dengan JavaScript</h3>
<table>
<tr>
<td width=150>Bilangan Pertama</td>
<td width=100>:<input type="text" size="12" name="bilangan1"></td>
</tr>
<tr>
<td width=150>Bilangan Kedua</td>
<td width=100>:<input type="text" size="12" name="bilangan2"></td>
</tr>
</table>
<p>
<table>
<tr>
<td width=5><input type="button" value="+" onclick="jumlah()"></td>
<td width=5><input type="button" value="-" onclick="kurang()"></td>
<td width=5><input type="button" value="x" onclick="kali()"></td>
<td width=5><input type="button" value=":" onclick="bagi()"></td>
<td width=10><input type="reset" value="Reset"></td>
</tr>
</table>
</center>
</form>
</body>
</html>
Keterangan :
Teks berwana merah merupakan fungsi untuk melakukan penjumlahan
Teks berwarna hijau merupakan fungsi untuk melakukan pengurangan
Teks berwana biru merupakan fungsi untuk melakukan perkalian
Teks berwarna ungu merupakan fungsi untuk melakukan pembagian
Teks berwarna coklat merupakan form untuk menampilkan pada halaman web
Hasilnya seperti berikut :
Selamat Mencoba !
mantab infonya,,
ReplyDeletemau tanya kalau mau dimodifikasi hanya perkalian saja tapi memakai 3 tabel bagaimana ya caranya?
Terimakasih
kitabfotografer.blogspot.com
maksudnya pake 3 bilangan?
Deletekita pake function kali() aja, variabelnya di tambah 1 misal bil3. Terus di formnya tambahin input text buat bilangan yg ketiga. Kalo belum jelas ke email rlh_258@yahoo.co.id aja mas. Terimakasih.
thank you info nya ...
ReplyDeletedan scriptnya udah saya coba dan saya modifikasi ..
iya sama-sama. okey :)
Deletetrimaksih atas informasinya,,ini menambah pengetahuan saya tentang JS.
ReplyDeletesama-sama semoga bermanfaat :)
DeleteMakasih sob, kebetulan saya lagi belajar javascript
ReplyDelete