`
冰绝皇妃
  • 浏览: 2217 次
  • 性别: Icon_minigender_2
最近访客 更多访客>>
lingooplay
文章分类
社区版块
存档分类
最新评论

网页计算器

onclickvarfunctionparseFloat 
阅读更多
这使用HTML中的js写的网页版计算器这是设计内容

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
.STYLE{
text-align:center;
}
</style>

<script>
var initData="";
var num1=0;
var num2=0;
var lastop="";//保存最后一个操作符
//获取数字
function getNum(num){
initData+=num;
showData(initData);
}
//获得操作符
function getOp(op){
lastop=op;
//保存第一个数num1=0-parseFloat(initData);
num1=parseFloat(initData);//转换并保存
//重新初始化
initData=""
}
function getBt(){
initData=0-parseFloat(initData);

showData(initData);
}
//获得结果
function getResult(){
//第一个数num1,已保存

//第二个数
num2=parseFloat(initData);
//符号lastop
//计算
var result=calc(num1,num2,lastop);
//显示结果
showData(result);
}
//计算方法
function calc(num1,num2,op){

var result=0;
switch(op){
case'+':result=num1 + num2;break;
case'-':result=num1 - num2;break;
case'*':result=num1 * num2;break;
case'/':if(num2==0) return;
else result=num1 / num2;break;
case'%':result=num1%num2;break;
}
return result;
}
function butClear(){
initData="";
    num1=0;
lastop="";
    num2=0;
result=0;
showData(0);
}
function retu(){
initData="";
    num1=0;
lastop="";
    num2=0;
result=0;
showData(0);
}
function butCe(){
var c=initData.substring(0,initData.length-1);
initData=(c);
showData(c);
}
//显示数据的方法
function showData(data){
document.getElementById("result").value=data;
}

</script>
</head>

<body>
<form id="form1" name="form1" method="post" action="">
  <table width="369" height="195" border="1" bgcolor="#FFCCFF">
    <tr>
      <td colspan="3" class="STYLE">
      <input type="text" name="result" id="result" value=""/>
      </td>
      <td width="65" class="STYLE">
      <input type="button" name="but1" id="but1" value=" C "  onclick="butClear()"/>
      </td>
      <td width="73" class="STYLE">
      <input type="button" name="but2" id="but2" value=" CE " onclick="butCe()"/>
      </td>
    </tr>
    <tr>
      <td width="67" class="STYLE">
       <input type="button" name="but3" id="but3" value=" 7 "onclick="getNum('7')" />
      </td>
      <td width="66" class="STYLE">
      <input type="button" name="but4" id="but4" value=" 8 "onclick="getNum('8')"/>
      </td>
      <td width="64" class="STYLE">
      <input type="button" name="but5" id="but5" value=" 9 "onclick="getNum('9')"/>
      </td>
      <td class="STYLE">
      <input type="button" name="but6" id="but6" value="+/-"  onclick="getBt()"/>
       </td>
      <td class="STYLE">
      <input type="button" name="but7" id="but7" value=" % " onclick="getOp('%')"/>
      </td>
    </tr>
    <tr>
      <td class="STYLE">
      <input type="button" name="but8" id="but8" value=" 4 " onclick="getNum('4')"/>
      </td>
      <td class="STYLE">
      <input type="button" name="but9" id="but9" value=" 5  "onclick="getNum('5')"/>
      </td>
      <td class="STYLE">
      <input type="button" name="but10" id="but10" value=" 6 "onclick="getNum('6')"/>
      </td>
      <td class="STYLE">
      <input type="button" name="but11" id="but11" value=" + " onclick="getOp('+')"/>
      </td>
      <td class="STYLE">
     <input type="button" name="but12" id="but12" value=" - "  onclick="getOp('-')"/>
      </td>
    </tr>
    <tr>
      <td class="STYLE">
      <input type="button" name="but13" id="but13" value=" 1 " onclick="getNum('1')" />
      </td>
      <td class="STYLE">
      <input type="button" name="but14" id="but14" value=" 2 " onclick="getNum('2')"/>
      </td>
      <td class="STYLE">
      <input type="button" name="but15"id="but15" value=" 3 " onclick="getNum('3')"/>
      </td>
      <td class="STYLE">
      <input type="button" name="but16" id="but16" value=" * " onclick="getOp('*')" />
      </td>
      <td class="STYLE">
      <input type="button" name="but17" id="but17" value=" / " onclick="getOp('/')"/>
      </td>
    </tr>
    <tr>
      <td class="STYLE">
      <input type="button" name="but18" id="but18" value=" 0 "onclick="getNum('0')"/>
      </td>
      <td class="STYLE">
      <input type="button" name="but19" id="but19" value=" . " onclick="getNum('.')"/>
      </td>
      <td>&nbsp;</td>
      <td class="STYLE">
      <input type="button" name="but20" id="but20" value=" = "  onclick="getResult()"/>
      </td>
      <td class="STYLE">
      <input type="button" name="but21" id="but21" value="返回" onclick="retu()" />
      </td>
    </tr>
  </table>
</form>
</body>
</html>
分享到：
| 九九乘法表
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics