Kalkulator yang kita buat saat ini memanfaatkan javascript dan DHTML. Yang kita lakukan disini pada DHTML yaitu menggabungkan fungsi HTML, style sheet sebagai box kalkulatornya dan scripting untuk fungsi - fungsi hitungannya. Untuk lebih lengkapnya perhatikan script dibawah ini.
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://WWW.W3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xlmns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>tugas kalkulator sederhana</title>
<style type="text/css">
.box1
{
width: 200px;
height: 300px;
background: #fdfb5c;
border: 1px solid red;
}
</style>
</head>
<body>
<script language="JavaScript" type ="text/javascript">
function tambah()
{
var myForm = document.form;
a=eval(myForm.input1.value)
b=eval(myForm.input2.value)
c=a+b
myForm.samadengan.value=c
}
function kurang()
{
var myForm = document.form;
a=eval(myForm.input1.value)
b=eval(myForm.input2.value)
c=a-b
myForm.samadengan.value=c
}
function kali()
{
var myForm = document.form;
a=eval(myForm.input1.value)
b=eval(myForm.input2.value)
c=a*b
myForm.samadengan.value=c
}
function bagi()
{
var myForm = document.form;
a=eval(myForm.input1.value)
b=eval(myForm.input2.value)
c=a/b
myForm.samadengan.value = c
}
function kosong()
{
var myForm = document.form;
myForm.input1.focus()
myForm.input1.value=""
myForm.input2.value=""
myForm.samadengan.value=""
}
</script>
<div class="box1">
<form name="form">
<center>
<h5>THE SIMPLE CALCULATOR</h5>
</center>
input 1 <input type="text" name="input1"><br>
input 2 <input type="text" name="input2">
<p><center>
<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()"></center></p>
<p>hasil : <input type "text" name="samadengan" disabled="true">
<p><center><input type="button" value="kosong" onclick="kosong()"></center>
<h5><center>By. Anom Langgeng Siswoko
D3.T.Elektronika 07'
407532305050</center></h5>
</form>
</div>
</body>
</html>
simpan script diatas dalam format html, maka tampilan akan seperti dibawah ini
Tidak ada komentar:
Posting Komentar