Currently my simple javascript calculator is capable of calculating whole numbers. However it is incapable of doing so with decimal numbers like 3,4 or 9,2 etc... getal1 & getal2 stand for number1 & number2. The functions are plus, minus, multiply, and divide respectively.
function plus()
{
var getal1 = document.getElementById('getal1').value;
var getal2 = document.getElementById('getal2').value;
document.getElementById('resultaat').value=parseInt(getal1) + parseInt(getal2);
document.form1.submit();
}
function min()
{
var getal1 = document.getElementById('getal1').value;
var getal2 = document.getElementById('getal2').value;
document.getElementById('resultaat').value=parseInt(getal1) - parseInt(getal2);
document.form1.submit();
}
function keer()
{
var getal1 = document.getElementById('getal1').value;
var getal2 = document.getElementById('getal2').value;
document.getElementById('resultaat').value=parseInt(getal1) * parseInt(getal2);
document.form1.submit();
}
function delen()
{
var getal1 = document.getElementById('getal1').value;
var getal2 = document.getElementById('getal2').value;
document.getElementById('resultaat').value=parseInt(getal1) / parseInt(getal2);
document.form1.submit();
}
<!doctype html>
<html>
<head>
<title>
Oefening calculator
</title>
<script src="Javascript.js">
</script>
<link rel="stylesheet" type="text/css" href="StyleSheet.css">
</head>
<body>
<div id="calculator">
<!-- Invoervelden getal1 en getal2 -->
<form id="point1">
<label for="getal1">
Geef 1e getal :
</label>
<input type="number" name="getal1" id="getal1">
<br />
<label for="getal2">
Geef 2e getal :
</label>
<input type="number" name="getal2" id="getal2">
</form>
<!-- De som knoppen -->
<div id="knoppen">
<button onClick="plus()">
+
</button>
<button onClick="min()">
-
</button>
<button onClick="keer()">
x
</button>
<button onClick="delen()">
/
</button>
</div>
<br />
<!-- Het resultaat tekstblok -->
<form id="point3">
<label for="resultaat">
Resultaat
</label>
<input type="number" name="resultaat" id="resultaat">
</form>
</div>
</body>
</html>
Change parseInt to parseFloat. parseInt is integer numbers, not decimals, and it ignores the decimals when users enter decimal numbers.
Example for your plus function:
function plus() {
var getal1 = document.getElementById('getal1').value;
var getal2 = document.getElementById('getal2').value;
document.getElementById('resultaat').value = parseFloat(getal1) + parseFloat(getal2);
document.form1.submit();
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With