Cara Buat Kalulator Sederhana dengan Javascript Code

Js calculator

Cara buat calculator dengan Javascript code - dalam tutorial js kita perlu mengenal tata cara membangun script code, sekarang kita akan coba buat calculator sederhana.

Dalam membangun calculator ini kita perlu mengenali beberapa fungsi dalam membangun tersebut diantaranya yaitu, js fungsi getElembtById, dalam tutorial sebemumnya sudah saya terangkan fungsi Get untuk mengambil nilai.

nilai yang dimabil kemudian di terjemahkan jadi dan di aplikasikan dengan js InnerHtml, dan memasukannya dengan fungai javascript value.

Mari kita lihat contoh secript Js Calculator di bawah ini.

   

Hasil :

3

 

Contoh tamilan js codenya. belum bisa berfungsi.

Keterangan script di bawah ini.

ada button fugsional tambah, kurang, kali, bagi. yang bila di click maka id panggil nila dalam value (isi) akan berubah, fungsi akan di jabarkan dalam functional tambah().

Id yang di ambil dari cek1 & cek2 serta panggil, yaitu cek1 di ( tambah,Kali,bagi,kurang) cek2.

Kemudian ada tombol untuk memproses hasil dari script tersebut.

Contoh JavaScript Calculator

<button onclick="tambah();">+</button>
<button onclick="kali();">x</button>
<button onclick="bagi();">:</button>
<button onclick="kurang();">-</button>
<br>
<div>Hasil :</div><div id="hass"></div>
<br>
<input type="number" value="1" id="cek1">
<br>
<input disabled="false" type="text" width="10%" id="panggil" value="+">
<br>
<input type="number" id="cek2" value="2">
<br>
<button onclick="hasil();">Tombol</button>
<br>

<script>
function hasil(){
var hasi1 =eval(document.getElementById('cek1').value);
var hasi3 =document.getElementById('panggil').value;
var hasi2 =eval(document.getElementById('cek2').value);


var mode=document.getElementById('panggil').value;
if(mode =="+"){
document.getElementById('hass').innerHTML=hasi1+hasi2;
}
if(mode =="-"){
document.getElementById('hass').innerHTML=hasi1-hasi2;
}
if(mode =="*"){
document.getElementById('hass').innerHTML=hasi1*hasi2;
}
if(mode =="/"){
document.getElementById('hass').innerHTML=hasi1/hasi2;
}


}

function tambah(){
document.getElementById('panggil').value="+";
}
function kali(){
document.getElementById('panggil').value="*";
}
function kurang(){
document.getElementById('panggil').value="-";
}
function bagi(){
document.getElementById('panggil').value="/";
}

</script>

Silahkan gunakan script di atas untuk menjalankan calculator dengan javascript code.

salam js code tutorial. 

Share this

Author : admin

Related Posts