Wednesday 13 June 2012

JavaScript & Simple HTML calculator using javascript


Javascript:
What can a JavaScript Do?
  • JavaScript gives HTML designers a programming tool - HTML authors are normally not programmers, but JavaScript is a scripting language with a very simple syntax! Almost anyone can put small "snippets" of code into their HTML pages
  • JavaScript can put dynamic text into an HTML page - A JavaScript statement like this: document.write("<h1>" + name + "</h1>") can write a variable text into an HTML page
  • JavaScript can react to events - A JavaScript can be set to execute when something happens, like when a page has finished loading or when a user clicks on an HTML element
  • JavaScript can read and write HTML elements - A JavaScript can read and change the content of an HTML element
  • JavaScript can be used to validate data - A JavaScript can be used to validate form data before it is submitted to a server. This saves the server from extra processing
  • JavaScript can be used to detect the visitor's browser - A JavaScript can be used to detect the visitor's browser, and - depending on the browser - load another page specifically designed for that browser
  • JavaScript can be used to create cookies - A JavaScript can be used to store and retrieve information on the visitor's computer
  •  Imperative and structured
  •  Dynamic
  •  Functional
  • Prototype-based
  •  Miscellaneous
  • Vendor-specific extensions

Description : The user inputs 2 numbers into 2 text boxes selects the operation he/ she wishes to perform and the result is displaced in the third text box.


/**
 *
 * @author ravikiran
 */
function division()
<body>
<input type="button" value="Add" onclick="javascript:add();">

<input type="button" value="Add" onclick="javascript:add();">
<html>
<head>
<title>SIMPLE CALCULATOR USING JAVASCRIPT</title>
<script language="javascript" type="text/javascript">
function multiply()
{
a=Number(document.calculator.number1.value);
b=Number(document.calculator.number2.value);
c=a*b;
document.calculator.total.value=c;
}
function add()
{
a=Number(document.calculator.number1.value);
b=Number(document.calculator.number2.value);
c=a+b;
document.calculator.total.value=c;
}
function subtract()
{
a=Number(document.calculator.number1.value);
b=Number(document.calculator.number2.value);
c=a-b;
document.calculator.total.value=c;
}

{
a=Number(document.calculator.number1.value);
b=Number(document.calculator.number2.value);
c=a/b;
document.calculator.total.value=c;
}
</script>
</head>

<form name="calculator">
Number 1:<input type="text" name="number1"><br/>
Number 2:<input type="text" name="number2"><br/>
Result:<input type="text" name="total"><br/><br/>

<input type="button" value="Multiply" onclick="javascript:multiply();"><br/>
<input type="button" value="divide" onclick="javascript:division();">
<input type="button" value="subtract" onclick="javascript:subtract();">
</form>
</body>
</html>


No comments:

Post a Comment