这篇文章主要为大家详细介绍了射流研究…版实现计算器功能,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
本文实例为大家分享了射流研究…实现计算器功能的具体代码,供大家参考,具体内容如下
在老师的带领下完成了这个简单的计算器,这是一个神奇的过程,计算器的基本功能都是有的。虽然是个简单的计算器,但对初学者来说,还是需要强大的逻辑判断能力,里面有很多的条件,作为开发者要不断的寻找设计里的bug,不断地完善用户的需求,而这些都需要清晰的逻辑推理和判断,我有点头大了。
!文档类型超文本标记语言
超文本标记语言
头部语言
meta charset='UTF-8 '
标题计算器/标题
风格
*{
填充:0;
边距:0;
}
表格{
宽度:400像素
边距:自动;
边框:1px纯银;
边框-塌陷:塌陷;/*列与列的间距*/
}
td {
宽度:100像素
边框:1px固体# 525252
}
(美)财政部(Treasury Department)输入{
宽度:98.7%;
高度:60px
大纲:无;
文本对齐:右对齐;
字体大小:20px
背景:rgba(251,255,227,0.81);
}
(美)财政部(Treasury Department)按钮{
宽度:100%;
高度:60px
字体大小:22px
背景:rgba(223,255,243,0.81);
}
/风格
/头
身体
桌子
tr
td colspan='4 '输入id=' text ' type=' text ' value=' 0 '//TD
/tr
tr
' 2 ' button class=' BTN ' del/button/TD
' BTN ' c/button/TD
/tr
tr
tdbutton class='btn'9/button/td
tdbutton class='btn'8/button/td
tdbutton class='btn'7/button/td
tdbutton class='btn' /button/td
/tr
tr
tdbutton class='btn'6/button/td
tdbutton class='btn'5/button/td
tdbutton class='btn'4/button/td
tdbutton class='btn'-/button/td
/tr
tr
tdbutton class='btn'3/button/td
tdbutton class='btn'2/button/td
TD按钮class=" BTN " 1/按钮/TD
tdbutton class='btn'*/button/td
/tr
tr
tdbutton class='btn'0/button/td
tdbutton class='btn ' ./button/td
tdbutton class='btn'=/button/td
tdbutton class='btn'//button/td
/tr
/表格
!- span id='m'8/span -
脚本
/* var M=文档。getelementbyid(' M ');
控制台。log(m . innerhtml);
控制台。日志(m . innertext);*/
//获取按钮
var button al=文档。getelementsbyclassname(' BTN ');
var textal=document。getelementbyid(“text”);
var RES=[];//定义一个数组存储输入的值
var label=false
for(var I=0;ibuttonal.lengthi ){
按钮[i].onclick=addclick
函数addclick(){
//输入为数字或者为"."
如果(!伊斯南(这个。innerhtml)| |这个。innerhtml==','){
//文本框初值不为0
标签=真
if(textal.value!=='0'){
//文本框中含有"."
if(textal.value.indexOf(' . ')))!==-1){
//处理点重复的问题文本框里面有点不上去点(用户按的数字得加用户按的是点不加)
//输入'.'时
如果(this.innerHTML!=='.'){
textal。价值=这个。innerhtml
}
}
否则{
textal。价值=这个。innerhtml
}
}
//文本框初值为0
否则{
if(this.innerHTML==' . '){
textal。value=' 0 ' this。innerhtml
}
否则{
textal。价值=这个。innerhtml
}
}
}
//非数字
否则{
开关(this.innerHTML ) {
案例"":保存(此);
打破;
大小写'-':保存(这个);
打破;
案例'/':保存(本);
打破;
案例' * ':保存(这个);
打破;
大小写"=":
资源推送(文本。值);
var result=eval(RES . join('));
if(result=='Infinity'){
remove _ add(' remove ');
}
textal.value=result==Infinity?'除数不能为零:结果;
//控制台。log(RES . join('));
RES=[];
打破;
案例“德尔”:
//从后往前一个一个的减数字substr(开始,计数)子串(开始,结束)结束不取
textal。值=文本。价值。长度==1?“0”:textal . value . substr(0,textal。价值。长度-1);
打破;
案例“c”:
textal。value=" 0
RES=[];
remove _ add(' add ');
打破;
}
}
}
}
功能保存(迷你){
//清屏之前存储用户按的值
//确认一个条件用户是连续按符号还是数字符号
如果(!标签){ //连续两次按符号时
分辨率[分辨率长度-1]=最小。innerhtml//第二次按的符号替代第一次的
}
否则{
资源推送(文本。值);
研究推动(迷你。innerhtml);
}
textal。value=" 0
标签=假;
}
//卸载除c以外的所有元素的事件
函数remove_add(p){
for(var I=0;ibuttonal.lengthi ){
if(p=='add'){
按钮[i].onclick=addclick
}
否则{
if(buttonal[i].innerHTML!='c'){
按钮[i].onclick=null
}
}
}
}
/脚本
/body
/html
效果图:
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。
郑重声明:本文由网友发布,不代表盛行IT的观点,版权归原作者所有,仅为传播更多信息之目的,如有侵权请联系,我们将第一时间修改或删除,多谢。