html编写计算器（怎么用html做一个网页计算器）

本篇文章给大家谈谈html编写计算器，以及怎么用html做一个网页计算器对应的知识点，希望对各位有所帮助，不要忘了收藏本站喔。

微信号：cloud7591
如需了解更多，欢迎添加客服微信咨询。
复制微信号

本文目录一览：

• 1、在 html中的js代码中怎么写一个计算器的加减乘除
• 2、怎么在网页上制作一个简易计算器
• 3、html写的计算器按下按钮后显示不出数字？？请各位帮我检查下代码好吗
• 4、php写一个简单的网页加法计算器 求助
• 5、用HTML代码写一个计算器

在 html中的js代码中怎么写一个计算器的加减乘除

!DOCTYPE html

html

head

meta http-equiv="Content-Type" content="text/html; charset=utf-8" /

title/title

/head

body

table

tr

tdinput type="button" value="add" onclick="setOp('+', 'add');"//td

tdinput type="button" value="miner" onclick="setOp('-', 'miner');"//td

tdinput type="button" value="times" onclick="setOp('*', 'times');"//td

tdinput type="button" value="divide" onclick="setOp('/', 'divide');"//td

/tr

/table

table id="tb_calc" style="display:none;"

tr

td input id="x" type="text" style="width:100px" value="" name="x" //td

td lable id="op" name="op"/lable /td

td input id="y" type="text" style="width:100px" value="" name="y" / /td

td input id="opTips" type="button" value="" onclick="calc();"/ /td

td lable id="z" name="z"/lable /td

/tr

/table

script type="application/javascript"

function setOp(op, opTips)

{

var tb=document.getElementById("tb_calc");

tb.style.display = "none";

document.getElementById("x").value = "";

document.getElementById("y").value = "";

document.getElementById("z").innerText = "";

document.getElementById("op").innerText = op;

document.getElementById("opTips").value = opTips;

tb.style.display = "block";

}

function calc()

{

var x = parseInt(document.getElementById("x").value);

var y = parseInt(document.getElementById("y").value);

var op = document.getElementById("op").innerText;

var z = "";

switch(op)

{

case '+':

z = x + y;

break;

case '-':

z = x - y;

break;

case '*': ;

z = x * y;

break;

case '/': ;

z = x / y;

break;

default:

z = '';

}

console.log(x, op, y, '=', z);

document.getElementById("z").innerText = z;

}

/script

/body

/html

怎么在网页上制作一个简易计算器

(1)先画个页面，把每个数字 运算符号放进去；

(2)然后每个数字 符号绑定一个事件，这个事件获取数字或者符号的值，放进一个Input框；

(3)点击计算，把Input框的字符串表达式计算，eval("1*2")；

(4)还有计算前要对表达式进行校验,不规则的表达式不能计算。

html写的计算器按下按钮后显示不出数字？？请各位帮我检查下代码好吗

你这个 input id="Result" type="text" Input 的 ID 明明是 Result

而你在 JS 代码中却频频使用 Text1.value = eval(Text1.value); Text1

把 Text1 全部改成 Result 试试看吧。

php写一个简单的网页加法计算器 求助

方法/步骤

首先打开Wamp Server 软件，在右下角找到绿色图标（有的用户显示的是橙色图标，也可以使用，没有影响。）说明软件打开成功，单击图标会弹出一个选择框，选择。

单击，会出现一个文件夹，然后在该文件夹里新建一个文本文档jsq.text。接着将jsq.text重命名为jsq.php。在重命名中会有个弹出框提示你是否将文件扩展名修改，点击确定就可以在文件夹中看到一个jsq.php的文件了。

打开浏览器在网址上输入localhost，按回车键，之后我们就可以在网页上看到有关WampServer的图标和信息,如果网页上没有显示说明你的WampServer没有打开或者软件安装时没有搭建好环境。

回到文件夹中，打开jsq.php文件（有php编辑器的就用编辑器打开，例 如:ZendStudio,Dreamweaver等。）然后先编辑html代码，将HTML的整体部分先写出来，在body里面加个table用来划分 个模块，然后在table里面嵌套一个form表单。打开浏览器就可以看到我们制作的静态页面了

将页面进行修饰，运用css给table添上样式，给table加上宽，高，还有文本文字居中。另外利用margin将计算器整体调整到中间，让整个页面更有协调感。并且可以添加一些背景颜色。

进行php代码的编写，首先定义一个变量$a，并且给它赋初值为0。然后运用if条件语句和if（）{}elseif(){}语句，进行两数的加减乘除判断，再将结果赋值给$a,最后将$a输出。

将html和php进行联系，通过表单post，将页面输入的数传到php，让php中的条件语句进行加减乘除的运算，然后将结果赋值给$a,而$a则通过表单将结果显示在网页上。

这样我们就将一个简单的PHP计算器做好了，下面让我们来进行最后一步，打开浏览器对我们制作的计算器进行测试，我们可以在下拉框中选择加减乘除，然后在文本框里任意填写数字，进行测试。

用HTML代码写一个计算器

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=middleinput name="ReadOut" type="Text" onkeypress="CheckOut()" size=24 value="0"

width=100%/TD

TD/TD

TDinput name="btnClear" type="Button" value=" C " onclick="Clear()"/TD

TDinput name="btnClearEntry" type="Button" value=" CE " onclick="ClearEntry()"/TD

/TR

TR

TDinput name="btnSeven" type="Button" value=" 7 " onclick="NumPressed(7)"/TD

TDinput name="btnEight" type="Button" value=" 8 " onclick="NumPressed(8)"/TD

TDinput name="btnNine" type="Button" value=" 9 " onclick="NumPressed(9)"/TD

TD/TD

TDinput name="btnNeg" type="Button" value=" +/- " onclick="Neg()"/TD

TDinput name="btnPercent" type="Button" value=" % " onclick="Percent()"/TD

/TR

TR

TDinput name="btnFour" type="Button" value=" 4 " onclick="NumPressed(4)"/TD

TDinput name="btnFive" type="Button" value=" 5 " onclick="NumPressed(5)"/TD

TDinput name="btnSix" type="Button" value=" 6 " onclick="NumPressed(6)"/TD

TD/TD

TD align=middleinput name="btnPlus" type="Button" value=" + " onclick="Operation('+')" /TD

TD align=middleinput name="btnMinus" type="Button" value=" - " onclick="Operation('-')"/TD

/TR

TR

TDinput name="btnOne" type="Button" value=" 1 " onclick="NumPressed(1)"/TD

TDinput name="btnTwo" type="Button" value=" 2 " onclick="NumPressed(2)"/TD

TDinput name="btnThree" type="Button" value=" 3 " onclick="NumPressed(3)"/TD

TD/TD

TD align=middleinput name="btnMultiply" type="Button" value=" * " onclick="Operation('*')"/TD

TD align=middleinput name="btnDivide" type="Button" value=" / " onclick="Operation('/')"/TD

/TR

TR

TDinput name="btnZero" type="Button" value=" 0 " onclick="NumPressed(0)"/TD

TDinput name="btnDecimal" type="Button" value=" . " onclick="Decimal()"/TD

TD colspan=2/TD

TDinput name="btnEquals" type="Button" value=" = " onclick="Operation('=')"/TD

TDinput 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 (comma1comma2) {

for (var i=0;icomma1-comma2;i++) str2 += "0";

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

}else {

for (var i=0;icomma2-comma1;i++) 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 (comma0) 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编写计算器的介绍就聊到这里吧，感谢你花时间阅读本站内容，更多关于怎么用html做一个网页计算器、html编写计算器的信息别忘了在本站进行查找喔。