DHTML dan Javascript
1. Cara membuat kalkulator sederhana.
Source Code :
<html lang="en">
<head><title>Kalkulator</title></head>
<script language="JavaScript">
function tambah(){
pertama = parseInt(form.pertama.value)
kedua = parseInt(form.kedua.value)
c = pertama+kedua
form.hasil.value = c}
function kurang(){
pertama = parseInt(form.pertama.value)
kedua = parseInt(form.kedua.value)
c = pertama-kedua
form.hasil.value=c}
function kali(){
pertama = parseInt(form.pertama.value)
kedua = parseInt(form.kedua.value)
c = pertama*kedua
form.hasil.value=c}
function bagi(){
pertama = parseInt(form.pertama.value)
kedua = parseInt(form.kedua.value)
c = pertama/kedua
form.hasil.value = c}
function hapus(){
document.form.reset();}
</SCRIPT>
<body>
<FORM name="form">
Angka Pertama : <input type="text" name="pertama"><br><br>
Angka Kedua : <input type="text" name="kedua"><br><br>
<input type="button" value=" + " onClick="tambah()">
<input type="button" value=" - " onClick="kurang()">
<input type="button" value=" * " onClick="kali()">
<input type="button" value=" / " onClick="bagi()"><br><br>
Hasil : <input type "text" name="hasil"><br><br>
<input type="button" value="Hapus" onClick="hapus()"/>
</FORM>
</body>
</html>
2. Cara membuat mesin kasir.
Source Code :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>.:: Gramedia ::.</title>
</head>
<body>
<script language="JavaScript" type="text/javascript">
function hitung(){
var kasir = document.form1;
var hbuku = 12000 * eval(kasir.buku.value);
var hpensil = 10000 * eval(kasir.pensil.value);
var hbolpoin = 15000 * eval(kasir.bolpoin.value);
var hpenghapus = 5000 * eval(kasir.penghapus.value);
var hpenggaris = 7000 * eval(kasir.penggaris.value);
var jumlahTotal = hbuku + hpensil + hbolpoin + hpenghapus + hpenggaris;
if (jumlahTotal > 50000){
kasir.Total.value = jumlahTotal;
kasir.Diskon.value = 10000;
kasir.Bayar.value = jumlahTotal - eval(kasir.Diskon.value);
} else {
kasir.Total.value = jumlahTotal;
kasir.Diskon.value = 0;
kasir.Bayar.value = jumlahTotal - eval(kasir.Diskon.value);
}
}
function hapus(){
document.form1.reset();
}
</script>
<h3>Toko Tulis</h3>
<form name="form1" action="#">
<table border="1px">
<tr>
<td align=center width="30">No</td>
<td align=center width="130">Alat Tulis</td>
<td align=center width="100">Harga</td>
<td align=center width="115">Jumlah</td></tr>
<tr>
<td align=center>1</td>
<td>Buku</td>
<td>Rp. <input id="n123" type="text" value="2000" size="7"/></td>
<td><input type="text" name="buku" size="14" value="0" onChange="hitung()"/></td></tr>
<tr>
<td align=center>2</td>
<td>Pensil</td>
<td>Rp. <input type="text" value="750" size="7"/></td>
<td><input type="text" name="pensil" size="14" value="0" onChange="hitung()"/></td></tr>
<tr>
<td align=center>3</td>
<td>Bolpoin</td>
<td>Rp. <input type="text" value="1500" size="7"/></td>
<td><input type="text" name="bolpoin" size="14" value="0" onChange="hitung()"/></td></tr>
<tr>
<td align=center>4</td>
<td>Penghapus</td>
<td>Rp. <input type="text" value="500" size="7"/></td>
<td><input type="text" name="penghapus" size="14" value="0" onChange="hitung()"/></td></tr>
<tr>
<td align=center>5</td>
<td>Penggaris</td>
<td>Rp. <input type="text" value="3000" size="7"/></td>
<td><input type="text" name="penggaris" size="14" value="0" onChange="hitung()"/></td></tr>
<tr>
<td colspan="3" align="right">Jumlah Total</td>
<td>Rp.<input type="text" name="Total" size="10"/></td></tr>
<tr>
<td colspan="3" align="right">Diskon</td>
<td>Rp.<input type="text" name="Diskon" size="10"/></td></tr>
<tr>
<td colspan="3" align="right">Jumlah Dibayar</td>
<td>Rp.<input type="text" name="Bayar" size="10" align="right"/></td></tr>
</table><br/>
<input type="button" value="Hapus" onClick="hapus()" />
</form>
</body>
</html>
0 Response to "DHTML dan Javascript"
Posting Komentar