一个网页表单效果，让表单内的文本框支持加减运算，不过你要按正确的运算式输入，要不然它没有那么智能哦，比如输入1+5，文本框旁边会显示计算结果，这要归功于JavaScript的功能。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>支持加减运算的文本框</title>
<meta http-equiv="content-type" content="text/html;charset=gb2312">
<style type="text/css">
body{color:#000;font-size:14px;font-family:Verdana,Arial,Helvetica,sans-serif,"宋体";}
input{border-style:solid;border-color:#868275;background-color:#f9f9f9;border-width:1px;color:#505050;vertical-align:middle;}
</style>
<script language=javascript>
function FloatAdd(arg1,arg2){
var r1,r2,m;
try{r1=arg1.toString().split(".")[1].length}catch(e){r1=0}
try{r2=arg2.toString().split(".")[1].length}catch(e){r2=0}
m=Math.pow(10,Math.max(r1,r2))
return (arg1*m+arg2*m)/m
}
function FloatSubtr(arg1,arg2){
return FloatAdd(arg1,-arg2);
}
function IsMoney(Money){
if(/^[\d|+|.|-]+$/.test(Money)) return true;
return false;
}
function result(){
str=document.getElementById("buy").value;
if(!(IsMoney(str))){
document.getElementById("amount").innerHTML ="无效金额";
return false;
}
var len=str.length,money=0,Num=0;
var NumStr="",ctrlflag="x",cflag=0;
for(var i=0;i<len; i++){
c= str.charAt(i);
if((c=="+")||(c=="-")){
if(i+1<len){
if ((str.charAt(i+1)=="+")||(str.charAt(i+1)=="-")) continue;
}
if((NumStr!="")&&(isNaN(NumStr))){
if(isNaN(NumStr)){
document.getElementById("amount").innerHTML ="输入无效金额";
return false;
}
}
if(NumStr!=""){
//alert("i："+i+"NumStr:"+NumStr);
if ((ctrlflag=="+")||(ctrlflag=="x")){
Num=parseFloat(NumStr);
//alert(ctrlflag+"money："+money+"Num："+Num);
money=FloatAdd(money,Num);
NumStr="";
Num=0;
ctrlflag=c;
}
else{
//alert(money+"里面减了"+NumStr);
Num=parseFloat(NumStr);
money=FloatSubtr(money,Num);
NumStr="";
Num=0;
ctrlflag=c;
}
}
else{
ctrlflag=c;
}
continue;
}
else{
NumStr=NumStr+""+c;
}
}
if((NumStr!="")&&(isNaN(NumStr))){
if (isNaN(NumStr)){
document.getElementById("amount").innerHTML ="无效金额"+NumStr;
return false;
}
}
if((ctrlflag=="-")&&(NumStr!="")){
Num=parseFloat(NumStr);
money=FloatSubtr(money,Num);
}
if(((ctrlflag=="+")||(ctrlflag=="x"))&&((NumStr!=""))){
Num=parseFloat(NumStr);
money=FloatAdd(money,Num);
}
document.getElementById("amount").innerHTML =money;
}
</script>
</head>
<body>
请输入加减计算式：<input id="buy" name="buy" maxlength="30" type="text" onkeyup="javascript:result();">
<span id="amount"></span>
</body>
</html>
相关推荐
本文实例讲述了js实现文本框支持加减运算的方法。分享给大家供大家参考。具体如下： 这是一个网页表单效果，让表单内的文本框支持加减运算，不过你要按正确的运算式输入，要不然它没有那么智能哦，比如输入1+5，...
利用java完成图形化用户界面实现加法运算，第一个加第二个当点击等号时在第三个文本框中显示相加之和
微信小程序实现的简易计算器，可以实现简单的运算（包括：加减乘除、平方根等） 微信小程序实现的简易计算器，可以实现简单的运算（包括：加减乘除、平方根等） 微信小程序实现的简易计算器，可以实现简单的运算...
实现一个如图界面的计算器，要求点击若干按钮后，计算式能在首栏文本框中显示。
常用的表达式计算，界面简洁精美,Vista黑色皮肤。功能支持括号深层次嵌套，支持计算结果重新调用,支持计算结果列表保存到文件,支持读取历史计算结果到列表
利用文本框输入两个操作数和一个运算符，进行相应的加法或减法运算并显示结果
编写一个应用程序，设计一个标题为“计算”的窗口，设计四个按钮，分别命名为“加”、“减”、“积”、“除”，设计三个文本框，单击相应的按钮，将两个文本框的数字做运算，在第三个文本框中显示结果。要求能够处理...
废话不多说，直接上代码 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>简单的计算器</title> <style> body{ margin: 0;... height: 402px
在17世纪初，西方国家的计算工具才有了较大的发展，英国数学家纳皮尔发明的"纳 皮尔算筹"，英国牧师奥却德发明了圆柱型对数计算尺，这种计算尺不仅能做加减乘除、 乘方、开方运算，甚至可以计算三角函数，指数函数...
java编写的计算器，能实现加减乘除。 //***该梦幻计算器与Windows附件自带计算器的标准版功能、界面相仿***// //******但还不支持键盘操作,如有需要，下一次等级将满足你**********// import java.awt.*; import ...
JavaScript控制文本框的值连续加减，一方面学习如何适时对文本框赋值，另一方面学习如何在对象上进行运算，很有用处哦。
2、设计步骤计算器myCalculator的主要功能是完成加、减、乘、除四则运算，而且支持连续计算，如4+5+7-8或4*5-6等运算。连续计算的实现借助于开发工具中预定义的数据结构Stack（栈）实现，如流程图所示
一、源码特点 采用winform进行开发,实现了计算器的加减乘除功能，零不能作除数的处理二、功能介绍 本源码是一个计算器源码,可计算简单的加减乘除运算，欢迎下载三、菜单功能 1、在操作数A文本框中输入数值 2、...
要求：(1) 用户可通过鼠标点击按钮输入运算数，在文本框中显示，实现加、减、乘、除等四则运算及倒数、取反功能。要求实现良好的布局效果，通过对按钮功能分类简化编程。（2） 除了鼠标输入外，可同时实现键盘输入和...
其中计算模块用来进行各种基本的加、减、乘、除的运算并且显示运算结果；错误分析模块用来进行错误处理；界面显示模块用来美化计算器界面；模式选择模块用来进行运算模式的选择和切换，以实现不同的运算要求
有四个菜单，分别是“逻辑运算”、“进行定点整数单符号位补码加减法”、“定点整数原码乘法”和“浮点数的加减运算”口令输入正确后菜单激活，按相应菜单进入相应窗口。 （2）选择主窗体中“逻辑运算”时进入逻辑...
实现机器数的真值还原（定点整数）、定点整数的单符号位补码加减运算、定点整数的原码一位乘法运算和浮点数的加减运算。 （1）系统进入（主）窗体的设计：菜单需要在输入口令正确后方可激活使用。口令输入错误时要...
js代码 [removed] function $(i){ return document.getElementById(i) ...function rand(min,max){return Math.round(Math.random()*(max-min) min)} ...var dui=0,cuo=0,time=60,fu1=0,fu2=0,add=0,pd=29;...
编写一个简单的基于图形的计算机程序，完成基本的数据加减乘除等功能。 1.输入一个数字：利用界面小键盘输入，还要显示在上面的文本框，网上查了关于button和textFile之间数据的传递的资料，直接在点击某个数字的...