Membuat Aplikasi Kalkulator Sederhana Dengan Javascript Bagian 2

Selamat Pagi,

Lama banget gg update sekarang, lagi pusing nih bingung juga iya. Hhmmmmm....
Tapi gpp lah, yang penting hadapi dengan kepala dingin.

Oke, kali ini ane mau berbagi source code lagi ni tentang aplikasi JavaScript. Kali ini lebih detail daripada versi sebelumnya. Coba cek ke Aplikasi kalkulator.

Aplikasi ini masih banyak bugsnya, jadi silakan anda edit sekalian buat belajar. Tapi sudah lumyan kog.

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Kalkulator JavaScript</title>
<style type="text/css">
.body {
    margin: 0px;
    padding: 0px;
    background-color: #efefef;
}
.body1 {
    margin: auto;
    padding: 5px;
    background-color: #f3f3f3;
    border: 1px solid #000;
    width: 250px;
}
.angka {
    width:30px;
    height:30px;
}
</style>

<script>
function add(angka){
    document.getElementById('display').value += angka;
}

function plusminus(input){
    var x = input.value;
    var y = x.substring(0, 1);

    if(y=='-'){
        input.value = input.value.substring(1, input.value.length);
    }
    else{
        input.value = '-'+input.value;
    }

}

function hitung(){
    var x = eval(document.getElementById('display').value);
    document.getElementById('display').value = x;
}

function hapus(){
    var x = document.getElementById('display').value;
    var y = x.length-1;
    var z = x.substring(0, y);
    document.getElementById('display').value = z;
}

function hapusAll(){
    document.getElementById('display').value = null;
}
</script>
</head>

<body class="body">
<div class="body1">
<h1>Kalkulator</h1>
<input type="text" name="display" id="display" /><br />
<input type="button" value="7" onclick="add('7')" class='angka' />
<input type="button" value="8" onclick="add('8')" class='angka' />
<input type="button" value="9" onclick="add('9')" class='angka' />
<input type="button" value="/" onclick="add('/')" class='angka' />
<input type="button" value="d" onclick="hapus()" class='angka' /><br />
<input type="button" value="4" onclick="add('4')" class='angka' />
<input type="button" value="5" onclick="add('5')" class='angka' />
<input type="button" value="6" onclick="add('6')" class='angka' />
<input type="button" value="*" onclick="add('*')" class='angka' />
<input type="button" value="CE" onclick="hapusAll()" class='angka' /><br />
<input type="button" value="1" onclick="add('1')" class='angka' />
<input type="button" value="2" onclick="add('2')" class='angka' />
<input type="button" value="3" onclick="add('3')" class='angka' />
<input type="button" value="-" onclick="add('-')" class='angka' /><br />
<input type="button" value="0" onclick="add('0')" class='angka' />
<input type="button" value="." onclick="add('.')" class='angka' />
<input type="button" value="-/+" onclick="plusminus(document.getElementById('display'))" class='angka' />
<input type="button" value="+" onclick="add('+')" class='angka' />
<input type="button" value="=" onclick="hitung()" class='angka' />
</div>
</body>
</html>

Ini ScreenShotnya :