Copy Code code as follows:
<title>js Version Calculator </title>
<link rel= "stylesheet" type= "Text/css" "href=" ">
<meta http-equiv= "Content-type" content= "Text/html;charset=utf-8" >
<!--JS code can be placed in any position, in order to sequentially perform in sequence between the head tag-->
<script type= "Text/javascript" >
/* Define a calculator class * *
function Calculator () {
This.jisuan=function (Num1,num2,oper) {
var res=0;
Switch (OPER) {
Case "+":
res=num1+num2;
Break
Case "-":
res=num1-num2;
Break
Case "*":
res=num1*num2;
Break
Case "/":
res=num1/num2;
Break
}
return res;
}
}
Creating objects
var calculator=new calculator ();
/* Define global variable * *
var val=0; Place the input value
var xval=0;//saves the value of the converted number type
var temp=0; Save the value you entered for the first time
var oper= "";//Save input operator
/* Get input number */
function InputEvent (e) {
val=e.value
var xsval= document.getElementById ("Inp1");
Xsval.value+=val; Continuous input numbers (string type)
//Convert number type
xval=parsefloat (Xsval.value);
}
/* Get the first line of data * *
function INPUTPCB (e) {
Window.alert (E.value);
var Xsval=document.getelementbyid ("Inp1");
if (e.value== "clear") {
Xsval.value= "";
}else if (e.value== "back") {
* * This feature has not yet been realized, interested friends can do their own * *
}else if (e.value== "power") {
Calculate squared
Xsval.value=math.pow (xsval.value,2);
}
}
/* Input operator/*
function Inputoper (e) {
Oper=e.value;
Window.alert (typeof Oper);
OPER=OPER.SUBSTR (0);
if (e.value== "+") {
var Xsval=document.getelementbyid ("Inp1");
Saves the last calculated result and converts the number type to the string
Temp=parsefloat (Xsval.value);
The first value entered is set to NULL
Xsval.value= "";
}else if (e.value== "-") {
var Xsval=document.getelementbyid ("Inp1");
Temp=parsefloat (Xsval.value);
Xsval.value= "";
}else if (e.value== "*") {
var Xsval=document.getelementbyid ("Inp1");
Temp=parsefloat (Xsval.value);
Xsval.value= "";
}else if (e.value== "/") {
var Xsval=document.getelementbyid ("Inp1");
Temp=parsefloat (Xsval.value);
Xsval.value= "";
}
}
/* Calculation Results * *
function Inputequel (e) {
var Xsval=document.getelementbyid ("Inp1");
if (e.value== "=") {
Window.alert (Xval);
Calling Object methods
Xsval.value=calculator.jisuan (Temp,xval,oper);
}
}
</script>
<!--CSS style-->
<style>
input{
width:60px;
}
#inp1 {
width:280px;
Text-align:right;
}
</style>
<body>
<table border= "1" >
<!--show Results rows-->
<TR><TD colspan= "4" ><input id= "INP1" type= "text" value= "" Name= "Xianshi"/></td></tr> "
<!--first line-->
<tr><td><input type= "button" value= "Power" onclick= "INPUTPCB (This)"/></td><td>< Input type= "button" value= "clear" onclick= "INPUTPCB (This)"/></td><td><input type= "button" value= " Back "onclick=" INPUTPCB (This)/></td><td></td></tr>
<!--second line-->
<tr><td><input type= "button" value= "1" onclick= "inputevent (This)"/></td><td>< Input type= "button" value= "2" onclick= "inputevent (This)"/></td><td><input type= "button" value= "3" Onclick= "InputEvent (This)"/></td><td><input type= "button" value= "4" onclick= "inputevent (This)" ></td></tr>
<!--third line-->
<tr><td><input type= "button" value= "5" onclick= "InputEvent (This)"/></td><td>< Input type= "button" value= "6" onclick= "inputevent (This)"/></td><td><input type= "button" value= "7" Onclick= "InputEvent (This)"/></td><td><input type= "button" value= "8" onclick= "InputEvent (This)" ></td></tr>
<!--line Fourth-->
<tr><td><input type= "button" value= "9" onclick= "InputEvent (This)"/></td><td>< Input type= "button" value= "0" onclick= "inputevent (This)"/></td><td><input type= "button" value= "." Onclick= "InputEvent (This)"/></td><td><input type= "button" value= "=" onclick= "Inputequel (This)" ></td></tr>
<!--line Fifth-->
<tr><td><input type= "button" value= "+" onclick= "Inputoper (This)"/></td><td>< Input type= "button" value= "-" onclick= "Inputoper (This)"/></td><td><input type= "button" value= "*" Onclick= "Inputoper (This)"/></td><td><input type= "button" value= "/" onclick= "Inputoper (This) ></td></tr>
</table>
</body>
PS: Here again for you to recommend two online calculator this site, are implemented with JS, and powerful, I believe that in-depth understanding of JavaScript math and web design will help:
Online Standard calculator:http://tools.jb51.net/jisuanqi/jsq
Online Science calculator:Http://tools.jb51.net/jisuanqi/jsqkexue