​បង្កើតម៉ាស៊ីនគិតលេខ​ Javascript

aរបៀបបង្កើត ម៉ាស៊ីនគិតលេខ (Calculator) ដ៏សាមញ្ញមួយ ដោយ លោកអ្នកអាចធ្វើការគណនា នូវវិធីបូក ដក គុណ និង ចែក។ទៅអនុវត្តន៍បន្ថែមបានយ៉ាងងាយស្រួល។ម៉ាស៊ីនគិតលេខ នេះ ត្រូវបានបង្កើតឡើងដោយបង្កើតជា function សម្រាប់ ប្រមាណ វិធី នីមួយៗ ដូចជា៖ function add(), function sub(), function multiply(), និង function devide() ជាដើម។ ក្នុងនោះផងដែរ ការបង្កើត រូបរាងវិញ គឺយើងប្រើ ប្រាស់ HTML Form រួមជាមួយ Table ប្រើផ្គួបគ្នា។ តាមកូដខាងក្រោម៖

      <!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>Sample Calculator</title>
<script type=”text/javascript”>
function add(){
var f=document.fn;
f.result.value = (f.var1.value)*1 + (f.var2.value)*1;
}
function minus(){
var f=document.fn;
f.result.value = f.var1.value – f.var2.value;
}
function multiply(){
var f=document.fn;
f.result.value = f.var1.value * f.var2.value;
}
function devide(){
var f=document.fn;
f.result.value = f.var1.value / f.var2.value;
}
</script>
</head>

<body>
<center>
<form name=”fn” style=”border:1px solid #666; width:300px; height:180px;”>
<table border=”0″>
<tr>
<td colspan=”2″ align=”center” style=”color:green; font-weight:bold; text-decoration:underline;”>IT CAMBO Calculator</td>
</tr>
<tr>
<td align=”right”>Input 1:</td><td align=”left”><input type=”text” name=”var1″ /></td>
</tr>
<tr>
<td align=”right”>Input 2:</td><td align=”left”><input type=”text” name=”var2″ /></td>
</tr>
<tr>
<td align=”right”> = :</td><td align=”left”><input type=”text” name=”result” disabled=”disabled” /></td>
</tr>
<tr>
<td colspan=”2″ align=”center”><input type=”radio” value=”Add” name=”opt” onclick=”add()” />Add<input type=”radio” value=”Sub” name=”opt” onclick=”minus()” />Sub<input type=”radio” name=”opt” value=”Multi” onclick=”multiply()” />Multi<input type=”radio” value=”Devide” name=”opt” onclick=”Devide()” />Devide</td>
</tr>
</table>
</form>
</center>
</body>
</html>