Selasa, 01 Maret 2011

Modul 5

Wah uda Masuk Modul 5 Moga j bisa dilihat,dibaca dan dipelajari oleh teman - teman
Studi Kasus
Berikut Outputnya :


Source Codenya :
<html>
<title>Kalkulator Sederhana</title>
<SCRIPT LANGUAGE="JavaScript">

function tambah()
{
a=parseInt(form.a.value)
b=parseInt(form.b.value)
c=a+b
form.hasil.value = c
}


function kurang()
{
a=parseInt(form.a.value)
b=parseInt(form.b.value)
c=a-b
form.hasil.value=c
}


function kali()
{
a=parseInt(form.a.value)
b=parseInt(form.b.value)
c=a*b
form.hasil.value=c
}


function bagi()
{
a=parseInt(form.a.value)
b=parseInt(form.b.value)
c=a/b
form.hasil.value = c
}


function pangkat()
{
a=parseInt(form.a.value)
b=parseInt(form.b.value)
c=Math.pow(a, b)
form.hasil.value = c
}

function kosong()
{
form.a.focus()
form.a.value=""
form.b.value=""
form.hasil.value=""

}

</SCRIPT>

<body onload=kosong()>
<hr size="6" color="yellow" width="35%" align="left">
<left>
<font color="green" size="5"><blink>Kalkulator Sederhana Dengan Java Script</blink></font></left>
<hr size="6" color="yellow" width="35%" align="left">

<FORM name="form">
Masukkan Angka Pertama
<br><input type="text" name="a"></br>
Masukkan Angka Kedua
<br><input type="text" name="b"></br>

<font color="blue"></font>
<input type="button" value=" + " onClick="tambah()">
<input type="button" value=" - " onClick="kurang()">
<input type="button" value=" x " onClick="kali()">
<input type="button" value=" / " onClick="bagi()">
<input type="button" value=" ^ " onClick="pangkat()"><br>

Tampilan Hasil
<br><input type "text" name="hasil" disabled="true"></br>


<left>
<pre>
<input type="button" value="Bersihkan" onClick="kosong()">
</left>
</pre>
<hr size="6" color="yellow" width="35%" align="left">
<font color="gray" size="3"><marquee direction="up" >::Tampilan Kalkulator Sederhana Menggunakan Java Script::</marquee></font>
<hr size="6" color="yellow" width="35%" align="left">
</FORM>
</center>

</body>
</html>

Tugas Pratikumnya

Outputnya sebagai berikut :


Source Codenya :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>Tugas Pratikum 5</title>
</head>

<body background="images/1.gif" onLoad="slide()">
<script language="JavaScript" type="text/javascript">
function pemesanan(){
var nota = document.form2;
var hargaBakso = 12000 * eval(nota.hrgBakso.value);
var hargaSoto = 10000 * eval(nota.hrgSoto.value);
var hargaMie = 15000 * eval(nota.hrgMie.value);
var hargaDegan = 5000 * eval(nota.hrgDegan.value);
var hargaCampur = 7000 * eval(nota.hrgCampur.value);
var TotalHarga = hargaBakso + hargaSoto + hargaMie + hargaDegan + hargaCampur;
if (TotalHarga > 50000){
nota.Total.value = TotalHarga;
nota.Diskon.value = 10000;
nota.Bayar.value = TotalHarga - eval(nota.Diskon.value);
} else {
nota.Total.value = TotalHarga;
nota.Diskon.value = 0;
nota.Bayar.value = TotalHarga - eval(nota.Diskon.value);
}
}
function resetForm(){
document.form2.reset();
}

function slide()
{

var i=0;

img =new Array();

img[0]="images/2.jpg";

img[1]="images/3.jpg";

img[2]="images/4.jpg";

img[3]="images/5.jpg";

img[4]="images/6.jpg";

document.anim.src=img[i];
setTimeout("slide()", 1000);
i++;
if(i==5)
{
i=0;
}
}


</script>

<H2><font color=blue><blink>Form Pemesanan Makan dan Minum</font></blink></H2>
<img src="images/2.jpg" width=100 height=100 name="anim">
<br>
<form name="form2">
<table border="1px">
<tr>
<th bgcolor="red">No</th>
<th bgcolor="red">Makanan/Minuman</th>
<th bgcolor="red">Harga</th>
<th bgcolor="red">Pesan</th>
</tr>
<tr>
<td width="20" bgcolor="red">1</td>
<td width="190"bgcolor="red">Bakso Istimewa</td>
<td width="90" bgcolor="red"> &#64; <input type="text" name="bakso" value="12000" size="7" readonly="readonly"/></td>
<td width="160" bgcolor="red"><input type="text" name="hrgBakso" value="0" onfocus="this.select()" onChange="pemesanan()"/></td>
</tr>
<tr>
<td bgcolor="red">2</td>
<td bgcolor="red">Soto Spesial</td>
<td bgcolor="red"> &#64; <input type="text" name="soto" value="10000" size="7" readonly="readonly"/></td>
<td bgcolor="red"><input type="text" name="hrgSoto" value="0" onfocus="this.select()" onChange="pemesanan()"/></td>
</tr>
<tr>
<td bgcolor="red">3</td>
<td bgcolor="red">Mie Ayam Super</td>
<td bgcolor="red"> &#64; <input type="text" name="mie" value="15000" size="7" readonly="readonly"/></td>
<td bgcolor="red"><input type="text" name="hrgMie" value="0" onfocus="this.select()" onChange="pemesanan()"/></td>
</tr>
<tr>
<td bgcolor="red">4</td>
<td bgcolor="red">Es Degan</td>
<td bgcolor="red"> &#64; <input type="text" name="degan" value="5000" size="7" readonly="readonly"/></td>
<td bgcolor="red"><input type="text" name="hrgDegan" value="0" onfocus="this.select()" onChange="pemesanan()"/></td>
</tr>
<tr>
<td bgcolor="red">5</td>
<td bgcolor="red">Es Campur</td>
<td bgcolor="red"> &#64; <input type="text" name="campur" value="7000" size="7" readonly="readonly"/></td>
<td bgcolor="red"><input type="text" name="hrgCampur" value="0" onfocus="this.select()" onChange="pemesanan()"/></td>
</tr>
<tr bgcolor="red">
<td colspan="3" align="right">Jumlah Total</td>
<td><input type="text" name="Total" readonly="readonly" /></td>
</tr>
<tr bgcolor="red">
<td colspan="3" align="right">Diskon</td>
<td><input type="text" name="Diskon" readonly="readonly"/></td>
</tr>
<tr bgcolor="red">
<td colspan="3" align="right">Jumlah Dibayar</td>
<td><input type="text" name="Bayar" readonly="readonly" align="right"/></td>
</tr>
</table><br/>
<input type="button" value="CLEAR" onClick="resetForm()" />
</form>
</body>
</html>

Tidak ada komentar:

Posting Komentar