js实现文本框支持加减运算的方法

本文实例讲述了js实现文本框支持加减运算的方法。分享给大家供大家参考。具体如下：
这是一个网页表单效果，让表单内的文本框支持加减运算，不过你要按正确的运算式输入，要不然它没有那么智能哦，比如输入1+5，文本框旁边会显示计算结果，这要归功于JavaScript的功能。
运行效果截图如下：

在线演示地址如下：
http://demo.jb51.net/js/2015/js-math-input-method-codes/
具体代码如下：

<！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>

希望本文所述对大家的javascript程序设计有所帮助。