Sunday, 29 March 2015

buat kalkulator dengan javascript

Posted on 21:16by with 6 comments
nah kali ini saya ingin share bagaimana sih buat javascript di html?
nah seperti biasa buat lah folder baru dan beri nama belajar js
kemudian buat index.php

selanjutnya copy script di bawah ini

<html>
<head>
<title>belajar java scrip kalkulator</title>
</head>
<body>
<form name="fkalkulator"><table>
<tr><td>masukan bilangan 1 = </td><td><input type="text" name="bil1"></td></tr>
<tr><td>masukan bilangan 2 = </td><td><input type="text" name="bil2"></td></tr>
<tr><td>hasilnya =</td><td><input type="text" name="hasil" onclick="penjumlahan()"></td></tr><br> </table><br>
<input type="button" name="" value="+" onmouseover="penjumlahan()">
<input type="button" name="" value="-" onmouseover="pengurangan()">
<input type="button" name="" value="*" onclick="perkalian()">
<input type="button" name="" value="/" onclick="pembagian()">
<br>
<input type="reset" name="" value="reset">
</form>

<script type="text/javascript">
function penjumlahan(){

var a=parseFloat(document.fkalkulator.bil1.value)
var b=parseFloat(document.fkalkulator.bil2.value)

var c=a+b
document.fkalkulator.hasil.value=c
}
function pengurangan(){

var a=parseFloat(document.fkalkulator.bil1.value)
var b=parseFloat(document.fkalkulator.bil2.value)

var d=a-b
document.fkalkulator.hasil.value=d
}
function perkalian(){

var a=parseFloat(document.fkalkulator.bil1.value)
var b=parseFloat(document.fkalkulator.bil2.value)

var e=a*b
document.fkalkulator.hasil.value=e
}
function pembagian(){

var a=parseFloat(document.fkalkulator.bil1.value)
var b=parseFloat(document.fkalkulator.bil2.value)

var f=a/b
document.fkalkulator.hasil.value=f
}
</script>
</body>
</html>

nah seperti yang kita lihat pada script di atas terdapat 2 buah inputan, 1 buah inputan hasil, dan 4 buah button dengan fungsi yang berbeda sesuai dengan aritmatika kali bagi tambah dan kurang, dan jugak ada tombol reset jika ingin mengosongkan nilai yang sudah di inputkan

<form name="fkalkulator">// nah pada script ini terdapat form yang memiliki name="fkalkulator" yang berfungsi untuk menandakan pada java script yang mana form yang mau di buat javascript nya
<table> // dan table ini hanya berfungsi untuk merapikan form yang kita buat
<tr><td>masukan bilangan 1 = </td><td><input type="text" name="bil1"></td></tr>//disini yang harus di perhatikan yaitu name="bil1" yang mana berfungsi untuk menjumlah kan bilangan pertama dengan bilangan kedua pada javascript nya
<tr><td>masukan bilangan 2 = </td><td><input type="text" name="bil2"></td></tr>////disini yang harus di perhatikan yaitu name="bil2" yang mana berfungsi untuk menjumlah kan bilangan kedua dengan bilangan pertama pada javascript nya
<tr><td>hasilnya =</td><td><input type="text" name="hasil"></td></tr>//disini yaitu untuk menampilkan hasil dari 2 buah bilangan tadi
<br> </table><br>
dan di bawah ini terdapat beberapa tombol yang berguna untuk memproses 2 buah bilangan kemudian di tampilkan ke inputan hasil
<input type="button" name="" value="+" onmouseover="penjumlahan()">//onmouseover berfungsi untuk menampilkan hasil cukup mengarah kan mouse ke button penjumlahan
<input type="button" name="" value="-" onmouseover="pengurangan()">
<input type="button" name="" value="*" onclick="perkalian()"> //onclick berfungsi untuk menampilkan hasil dengan mengklik button perkalian tsb
<input type="button" name="" value="/" onclick="pembagian()">
<br>
<input type="reset" name="" value="reset">
</form>

<script type="text/javascript">//untuk memulai javascript
function penjumlahan(){//sebuah function yang di gunakan untuk pemanggilan pada sebuah button

var a=parseFloat(document.fkalkulator.bil1.value) //pembentukan variabel pada javascript dari name bil1 menjadi variabel a
var b=parseFloat(document.fkalkulator.bil2.value)//pembentukan variabel pada javascript dari name bil2 menjadi variabel b

var c=a+b// proses dua buah varibel kemudian di masukan kedalam variabel baru yang kita buat terserah nama nya di sini saya menggunakan variable c
document.fkalkulator.hasil.value=c//untuk menampilkan hasil dari proses 2 buah variable tadi
}
</script>// jangan lupa ini utuk mengakhiri sebuah proses pada java script

nah cuman itu yang dapat saya sampai kan salah kata saya mohon maaf...
kalo ada yang eror bisa di coment di bawah ini


6 comments:

  1. famadaya7 August 2015 at 07:57

    Makasih sob, kebetulan saya lagi belajar javascript

    ReplyDelete
    Replies
    1. irsyad pahlapi7 September 2015 at 08:15

      oke bro kalo ada yang mau di tanyain jangan sungkan sungkan borong aja :D

      Delete
  2. Unknown25 February 2016 at 20:18

    permisi kak, mau nanyak gimana caranya menentukan bilangan prima atau bukan tanpa menggunakan alert, melainkan muncul menggunakan text, dan angka yang mau di tentukan(input) juga menggunakan text.

    ReplyDelete
  3. irsyad pahlapi10 May 2016 at 12:32

    ya sama aja kaya di atas tinggal di ganti rumus nya yang habis di bagi dengan bilangan nya itu sendiri trus di kasih looping, kalo sampai 100 biasanya saya 2,3,4,5

    ReplyDelete
  4. Berkah Chicken19 July 2018 at 23:21

    permisi kaka kan saya ingin membuat total datanya dari subtotal itu gimana caranya ya?

    ReplyDelete
  5. Shikamaru Nara20 March 2020 at 02:05

    infonya sangat bermnafaat bagi ane
    Solder uap

    ReplyDelete

Subscribe to: Post Comments (Atom)