Welcome

widget

7 Maret 2010

Membuat Kalkulator dengan DHTML dan Java Script

Scripting merupakan jenis dari pemograman, yang umumnya lebih mudah dipahami. Script dapat disisipkan ke dalam dokument HTML dengan menggunakan tag . Tidak seperti style sheet, scrpt bisa terlihat di dalam ataupun
DHTML merupakn suatu teknik untuk menciptakan halaman web yang interaktif dengan cara mengkombinasikan element-element seperti HTML, style sheet, dan scripting. Jadi DHTML bukanlah suatu jenis bahasa pemograman melainkan hanya sekedar istilah saja. Pada bagian ini, pembuatan DHTML akan dilakukan dengan memanfaatkan JavaScript


Berikut langkah-langkah membuatnya:
1. Tuliskan Program di bawah ini:

<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
<title>membuat kalkulator</title>
</head>


<body>
<script language="JavaScript" type="text/javascript">
<!--

function rumus(){
var myForm = document.form1;
var a=eval(myForm.a.value);
var b=eval(myForm.b.value);
var ex= myForm.has.value;

if (ex == "tambah") {
var z = a + b;

}else if (ex == "kurang") {
var z = a - b;

} else if (ex == "kali") {
var z = a * b;

} else if (ex == "bagi") {
var z = a / b;

}

myForm.hasil.value = z;
myForm.a.value = "";
myForm.b.value = "";

}


function resetForm(){
document.form1.reset();
}

//-->

</script>

<form name="form1" action="#">
<input type="text" name="a" />
<select name="has">

<option value="tambah"> + </option>
<option value="kurang"> - </option>
<option value="kali"> * </option>
<option value="bagi"> / </option>

</select>

<input type="text" name="b" />
<input type="button" value="=" onClick="rumus()" />
<input type="text" name="hasil" disabled="true" /><br/>
<input type="button" value="HAPUS" onClick="resetForm()" />

</form>
</body>
</html>

2. Simpan misalnya dengan nama kalkulator.html
3. setelah di-save hasilnya tampak seperti gambar:



4. Selesai, Mudah Khan :) selamat mencoba :)