用HTML代码写一个计算器

html-css020

用HTML代码写一个计算器,第1张

<html>

<head>

<title>计算器</title>

</head>

<body bgcolor="#ffffff" onload="FKeyPad.ReadOut.focus()FKeyPad.ReadOut.select()">

<FORM name="Keypad" action="">

<TABLE align="center">

<B>

<TABLE align="center" border=2 width=50 height=60 cellpadding=1 cellspacing=5>

<TR>

<TD colspan=3 align=middle><input name="ReadOut" type="Text" onkeypress="CheckOut()" size=24 value="0"

width=100%></TD>

<TD></TD>

<TD><input name="btnClear" type="Button" value=" C " onclick="Clear()"></TD>

<TD><input name="btnClearEntry" type="Button" value=" CE " onclick="ClearEntry()"></TD>

</TR>

<TR>

<TD><input name="btnSeven" type="Button" value=" 7 " onclick="NumPressed(7)"></TD>

<TD><input name="btnEight" type="Button" value=" 8 " onclick="NumPressed(8)"></TD>

<TD><input name="btnNine" type="Button" value=" 9 " onclick="NumPressed(9)"></TD>

<TD></TD>

<TD><input name="btnNeg" type="Button" value=" +/- " onclick="Neg()"></TD>

<TD><input name="btnPercent" type="Button" value=" % " onclick="Percent()"></TD>

</TR>

<TR>

<TD><input name="btnFour" type="Button" value=" 4 " onclick="NumPressed(4)"></TD>

<TD><input name="btnFive" type="Button" value=" 5 " onclick="NumPressed(5)"></TD>

<TD><input name="btnSix" type="Button" value=" 6 " onclick="NumPressed(6)"></TD>

<TD></TD>

<TD align=middle><input name="btnPlus" type="Button" value=" + " onclick="Operation('+')"></TD>

<TD align=middle><input name="btnMinus" type="Button" value=" - " onclick="Operation('-')"></TD>

</TR>

<TR>

<TD><input name="btnOne" type="Button" value=" 1 " onclick="NumPressed(1)"></TD>

<TD><input name="btnTwo" type="Button" value=" 2 " onclick="NumPressed(2)"></TD>

<TD><input name="btnThree" type="Button" value=" 3 " onclick="NumPressed(3)"></TD>

<TD></TD>

<TD align=middle><input name="btnMultiply" type="Button" value=" * " onclick="Operation('*')"></TD>

<TD align=middle><input name="btnDivide" type="Button" value=" / " onclick="Operation('/')"></TD>

</TR>

<TR>

<TD><input name="btnZero" type="Button" value=" 0 " onclick="NumPressed(0)"></TD>

<TD><input name="btnDecimal" type="Button" value=" . " onclick="Decimal()"></TD>

<TD colspan=2></TD>

<TD><input name="btnEquals" type="Button" value=" = " onclick="Operation('=')"></TD>

<TD><input name="btnReturn" type="Button" value="返 回" onclick="goReturn()"></TD>

</TR>

</TABLE>

</TABLE>

</B>

</FORM>

</CENTER>

<font face="Verdana, Arial, Helvetica" size=2>

<SCRIPT LANGUAGE="JavaScript">

<!-- Begin

var FKeyPad = document.forms['Keypad']

var Accum = "0"

var FlagNewNum = false

var PendingOp = ""

//===============================================================================

//[描述] 浮点数精确计算

//[参数] str1 - 第一个数

// str2 - 第二个数

// type - 运算符

// precision - 小数位精度

//[调用方式] longCount(str1,str2,type,precision)

//[返回值] 计算结果

//===============================================================================

function longCount(str1,str2,type) {

var comma1 = 0

if (str1.indexOf(".")!=-1) {

str1 = str1.replace(/0*$/,"")

comma1 = str1.length - str1.indexOf(".")-1

}

var comma2 = 0

if (str2.indexOf(".")!=-1) {

str2 = str2.replace(/0*$/,"")

comma2 = str2.length - str2.indexOf(".")-1

}

str1 = str1.replace(/\./,"")

str2 = str2.replace(/\./,"")

var value,comma

if (type!="*") {

if (comma1>comma2) {

for (var i=0i<comma1-comma2i++) str2 += "0"

comma = (type=="/")?0:comma1

}else {

for (var i=0i<comma2-comma1i++) str1 += "0"

comma = (type=="/")?0:comma2

}

}else {

comma = comma1 + comma2

}

if (type=="+") {

value = parseInt(str1,10) + parseInt(str2,10)

}else if (type=="-") {

value = parseInt(str1,10) - parseInt(str2,10)

}else if (type=="*") {

value = parseInt(str1,10) * parseInt(str2,10)

}else if (type=="/") {

value = parseInt(str1,10) / parseInt(str2,10)

}

value = String(value)

if (comma>0) value = value.substring(0,value.length-comma)+"."+value.substring(value.length-

comma,value.length)

if (value.indexOf(".")!=-1)

value = value.replace(/0*$/,"")

return value

}

function NumPressed (Num) {

if (FlagNewNum) {

FKeyPad.ReadOut.value = Num

FlagNewNum = false

}

else {

if (FKeyPad.ReadOut.value == "0")

FKeyPad.ReadOut.value = Num

else

FKeyPad.ReadOut.value += Num

}

}

function Operation (Op) {

var Readout = FKeyPad.ReadOut.value

if (FlagNewNum &&PendingOp != "=")

else

{

FlagNewNum = true

if ( '+' == PendingOp || '-' == PendingOp || '/' == PendingOp || '*' == PendingOp)

Accum = longCount(Accum,Readout,PendingOp)

else

Accum = Readout

FKeyPad.ReadOut.value = Accum

PendingOp = Op

FKeyPad.ReadOut.focus()

FKeyPad.ReadOut.select()

}

}

function Decimal () {

var curReadOut = FKeyPad.ReadOut.value

if (FlagNewNum) {

curReadOut = "0."

FlagNewNum = false

}

else

{

if (curReadOut.indexOf(".") == -1)

curReadOut += "."

}

FKeyPad.ReadOut.value = curReadOut

}

function ClearEntry () {

FKeyPad.ReadOut.value = "0"

FlagNewNum = true

}

function Clear () {

Accum = "0"

PendingOp = ""

ClearEntry()

}

function Neg () {

alert(FKeyPad.ReadOut.value)

FKeyPad.ReadOut.value = longCount(FKeyPad.ReadOut.value,"-1","*")

}

function Percent () {

FKeyPad.ReadOut.value = longCount(FKeyPad.ReadOut.value,Accum,"*")

FKeyPad.ReadOut.value = longCount(FKeyPad.ReadOut.value,100,"/")

}

function goReturn() {

top.returnValue = FKeyPad.ReadOut.value

self.close()

}

function CheckOut() {

var keyCode = window.event.keyCode

if (keyCode>=48 &&keyCode<=57) {

if (FlagNewNum) {

FKeyPad.ReadOut.value = ""

//window.event.keyCode = null

FlagNewNum = false

}

return true

}else if (keyCode==43 || keyCode==45 || keyCode==42 || keyCode==47 || keyCode==61) {

Operation(String.fromCharCode(keyCode))

}else if (keyCode==46) {//.

if (FKeyPad.ReadOut.value.indexOf(".") == -1)

return true

}else if (keyCode==13) goReturn()

window.event.returnValue = false

return false

}

// End -->

</SCRIPT>

</body>

</html>

我这里有一个现成的，自己再改一下吧（<HTML>

<HEAD>

<SCRIPT LANGUAGE = "JavaScript">

function calcu(){

var numb1= document.calc.num1.value

var numb2= document.calc.num2.value

var total= parseFloat(numb1)*parseFloat(numb2)

document.calc.result.value=total

}

</SCRIPT>

<script type="text/javascript" language="JavaScript1.2" src="menu.js"></script>

</HEAD>

<BODY>

<FORM name="calc">

<P><BR>

<font size="5">会说话的QQ竞拍喽！</fo

<BR>

竟拍价?

<INPUT name="num2" TYPE="text" id="num2" value="120" size="15"><BR>

购买数量：

<INPUT TYPE="text" name="num1" size="15"> <BR>

预计总价：

<INPUT name="result" TYPE="text" size="15">

</P>

<P>

<INPUT name="getAnswer" TYPE="button" id="getAnswer" onClick="calcu()"

value="计算看看"><!--单机鼠标调

</P>

</FORM>

</BODY>

</HTML>

）