In this article I would like to share with you a sample program that will ask the user to give two numbers and then our program will automatically compute the sum and product of the two numbers using JQuery.
My email address are the following jakerpomperada@gmail.com and jakerpomperada@yahoo.com.
My telephone number at home here in Bacolod City, Negros Occidental Philippines is +63 (034) 4335675.
Sample Program Output
Program Listing
index.htm
<html>
<head>
<title>JQuery Sum & Product of Two Numbers</title>
</head>
<body>
<form name="form">
<table>
<tr>
<td>Number 1:</td>
<td><input type="text" name="num1" id="num1" /></td>
</tr>
<tr>
<td>Number 2:</td>
<td><input type="text" name="num2" id="num2" /></td>
</tr>
<tr>
<td>Sum:</td>
<td><input type="text" name="sum" id="sum" readonly /></td>
</tr>
<tr>
<td>Product:</td>
<td><input type="text" name="subt" id="subt" readonly /></td>
</tr>
</table>
</form>
<script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js'></script>
<script>
$(function() {
$("#num1, #num2").on("keydown keyup", sum);
function sum() {
$("#sum").val(Number($("#num1").val()) + Number($("#num2").val()));
$("#subt").val(Number($("#num1").val()) * Number($("#num2").val()));
}
});
</script>
</body>
</html>
No comments:
Post a Comment