Aplikasi Kalkulator Sederhana dengan javascript

Label:

Scripting merupakan jenis lain dari pemrograman, yang umumnya lebih mudah dipahami. DHTML (Dynamic HTML) merupakan suatu teknik untuk menciptakan halaman web yang interaktif dengan cara mengombinasikan elemen-elemen seperti HTML, style sheet, dan scripting. Jadi, DHTML bukanlah suatu jenis bahasa pemrograman melainkan hanya sekadar istilah saja. Pada bagian ini,pembuatan DHTML akan dilakukan dengan memanfaatkan JavaScript.

Contoh dari penggunaan javascript adalah seperti apliksi kalkulator sederhana.

Membuat program kalkulator sederhana menggunakan input prompt javascript ini akan sangat berguna bagi anda yang baru belajar java script karena saya juga baru belajar dan hasil karya dari program ini adalah sebagai berikut:



Kode program:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Aplikasi Kalkulator Sederhana</title>

<script language="javascript" type="text/javascript">
<!--
var flag = false;
function isi(num) {
if (flag) calc.b.value += num;
else calc.a.value += num;
}
function tambah()
{
calc.opr.value = ' + '
flag = true;
calc.b.focus()
}
function kurang()
{
calc.opr.value = ' - '
flag = true;
calc.b.focus()
}
function kali()
{
calc.opr.value = ' * '
flag = true;
calc.b.focus()
}
function bagi()
{
calc.opr.value = ' / '
flag = true;
calc.b.focus()
}
//-->
</script>
<style type="text/css">
p {
font-family:arial;
font-size:10px;
line-height:1.6em;
font-weight:bold;
color:#727272
}
</style>
</head>
<body onload=kosong()>
<center>
<p style="padding:20px 0px 30px 0px"><font size="4" color="black"><u>Aplikasi Kalkulator Sederhana</u></font></p>
<form name="calc">

<tr>
<td>
<input type="text" name="a" size="2" />
<select name="opr" onchange="setSelected(this);">
<option>-Pilih-</option>
<option value="+">+</option>
<option value="-">-</option>
<option value="*">*</option>
<option value="/">/</option>
</select>
<input type="text" name="b" size="2" />
<input type="button" name="hasil" value="=" onclick="calc.c.value=eval(calc.a.value+calc.opr.value+calc.b.value)" />
<input type="text" name="c" size="2" />
<br/>
</td>
</tr>
</table>
</form>
</body>
</html>

Nah, itu tadi tampilan untuk aplikasi kalkutalor sederhana dengan javascript. Pengen tau aplikasi kalkulator lainnya, tenang aja masih banyak lagi aplikasi-aplikasi yang lain, contohnya seperti dibawah ini:



Kode program:

<html>
<title> program kalkulator sederhana </title>
<SCRIPT LANGUAGE="JavaScript">
function tambah()
{
a=eval(form.a.value)
b=eval(form.b.value)
c=a+b
form.hasil.value = c
}
function kurang()
{
a=eval(form.a.value)
b=eval(form.b.value)
c=a-b
form.hasil.value=c
}
function kali()
{
a=eval(form.a.value)
b=eval(form.b.value)
c=a*b
form.hasil.value=c
}
function bagi()
{
a=eval(form.a.value)
b=eval(form.b.value)
c=a/b
form.hasil.value = c
}
function pangkat()
{
a=eval(form.a.value)
b=eval(form.b.value)
c=Math.pow(a, b)
form.hasil.value = c
}
function kosong()
{
form.a.focus()
form.a.value=""
form.b.value=""
form.hasil.value=""
}

</SCRIPT>
<body onload=kosong()>
<CENTER>
<font size="6">Program Kalkulator Sederhana</font>

<FORM name="form">
<pre>
Angka 1 <input type="text" name="a"></br>
Angka 2 <input type="text" name="b">

Hasil <input type "text" name="hasil" disabled="true">
</pre>
<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()">
<input type="button" value=" ^ " onClick="pangkat()">
<input type="button" value=" Hapus " onClick="kosong()">

<br>

</FORM>
</CENTER>

</body>
</html>

0 komentar:

Posting Komentar

Langganan: Posting Komentar (Atom)

Video Pembelajaran "Perakitan Komputer"