Kode HTML Kalkulator di Blog Secara Online


Kalkulator adalah alat bantu untuk menghitung dari perhitungan sederhana seperti penjumlahan, pengurangan, perkalian dan pembagian sampai kepada kalkulator sains yang dapat menghitung rumus matematika tertentu.

Program kalkulator sebenarnya bisa dibuat dengan menggunakan HTML, kalkulator ini sangat sederhana, dan belum maksimal, tetapi bisa digunakan sebagai langkah awal untuk membuat aplikasi kalkulator yang lebih canggih.


Berikut adalah kode HTML untuk membuat sebuah Kalkulator di Web/Blog:

<!DOCTYPE html> 
<html>
 <head> 
 <meta charset="utf-8"> <title>Kalkulator</title> </head> <body> <FORM NAME="Calc"> <TABLE BORDER=4> <TR> <TD> <INPUT TYPE="text" NAME="Input" Size="20"> <br> </TD> </TR> <TR> <TD> <INPUT TYPE="button" NAME="one" VALUE=" 1 " OnClick="Calc.Input.value += '1'"> <INPUT TYPE="button" NAME="two" VALUE=" 2 " OnCLick="Calc.Input.value += '2'"> <INPUT TYPE="button" NAME="three" VALUE=" 3 " OnClick="Calc.Input.value += '3'"> <INPUT TYPE="button" NAME="plus" VALUE=" + " OnClick="Calc.Input.value += ' + '"> <br> <INPUT TYPE="button" NAME="four" VALUE=" 4 " OnClick="Calc.Input.value += '4'"> <INPUT TYPE="button" NAME="five" VALUE=" 5 " OnCLick="Calc.Input.value += '5'"> <INPUT TYPE="button" NAME="six" VALUE=" 6 " OnClick="Calc.Input.value += '6'"> <INPUT TYPE="button" NAME="minus" VALUE=" - " OnClick="Calc.Input.value += ' - '"> <br> <INPUT TYPE="button" NAME="seven" VALUE=" 7 " OnClick="Calc.Input.value += '7'"> <INPUT TYPE="button" NAME="eight" VALUE=" 8 " OnCLick="Calc.Input.value += '8'"> <INPUT TYPE="button" NAME="nine" VALUE=" 9 " OnClick="Calc.Input.value += '9'"> <INPUT TYPE="button" NAME="times" VALUE=" x " OnClick="Calc.Input.value += ' * '"> <br> <INPUT TYPE="button" NAME="clear" VALUE=" c " OnClick="Calc.Input.value = ''"> <INPUT TYPE="button" NAME="zero" VALUE=" 0 " OnClick="Calc.Input.value += '0'"> <INPUT TYPE="button" NAME="DoIt" VALUE=" = " OnClick="Calc.Input.value = eval(Calc.Input.value)"> <INPUT TYPE="button" NAME="div" VALUE=" / " OnClick="Calc.Input.value += ' / '"> <br> </TD> </TR> </TABLE> </FORM> </FORM> 
 </body> 
</html>
Demo & Download Code


Langkah-Langkah Membuat Kalkulator di Blog Secara Online:

  1. Masuk Blogger.com
  2. Buat Halaman Baru atau Postingan Blog. 
  3. Buka Tampilan HTML, copy & paste script diatas lalu letakkan kode tersebut ke dalamnya. Lihat gambar dibawah untuk lebih jelasnya!
  4. Jika sudah, tekan Publikasikan untuk menerbitkan kalkulator secara online.
  5. Kurang lebih hasilnya seperti dibawah ini!


Mudah bukan? Itulah postingan cara membuat kalkulator di blog secara online menggunakan kode HTML yang bisa dipelajari secara otodidak. Semoga bermanfaat dan menambah wawasan bagi yang membutuhkannya. Terima kasih.