<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<!--给button添加样式-->
<style type="text/css">
input[type=button]{
width: 95px;
height: 75px;
}
</style> <script type="text/javascript">
//点击按钮的时候 触发执行的方法
function clickNum(num){
var inp =document.getElementById("num");
switch(num){
//清空输入框内容
case"c":inp.value="";
break;
case"=":
inp.value=eval(inp.value);
break;
//将点击的按钮的内容连接到输入框的
default:inp.value+=num;
break;
}
}
</script>
</head>
<body>
<br />
<br />
<br />
<center>
<div style="width:470px;height: 620px;border: solid 1px black; "> <input type="text"id="num"style="width: 400px;height: 70px;"/>
<br /><br />
<input type="button" name="" id="" value="1" onclick="clickNum(this.value)"/>
<input type="button" name="" id="" value="2" onclick="clickNum(this.value)"/>
<input type="button" name="" id="" value="3" onclick="clickNum(this.value)" />
<input type="button" name="" id="" value="+" onclick="clickNum(this.value) "/>
<br /><br />
<input type="button" name="" id="" value="4" onclick="clickNum(this.value)" />
<input type="button" name="" id="" value="5" onclick="clickNum(this.value)" />
<input type="button" name="" id="" value="6" onclick="clickNum(this.value)" />
<input type="button" name="" id="" value="-" onclick="clickNum(this.value)"/>
<br /><br />
<input type="button" name="" id="" value="7" onclick="clickNum(this.value)" />
<input type="button" name="" id="" value="8" onclick="clickNum(this.value) "/>
<input type="button" name="" id="" value="9" onclick="clickNum(this.value) "/>
<input type="button" name="" id="" value="*" onclick="clickNum(this.value)"/>
<br /><br />
<input type="button" name="" id="" value="c" onclick="clickNum(this.value)"/>
<input type="button" name="" id="" value="0" onclick="clickNum(this.value)"/>
<input type="button" name="" id="" value="=" onclick="clickNum(this.value)"/>
<input type="button" name="" id="" value="/" onclick="clickNum(this.value)"/>
</div>
</center> </body>
</html>

  

实训篇-Html-计算器的更多相关文章

  1. Android实训案例(一)——计算器的运算逻辑

    Android实训案例(一)--计算器的运算逻辑 应一个朋友的邀请,叫我写一个计算器,开始觉得,就一个计算器嘛,很简单的,但是写着写着发现自己写出来的逻辑真不严谨,于是搜索了一下,看到mk(没有打广告 ...

  2. Java企业实训 - 01 - Java前奏

    前言: 虽然个人专攻.NET方向,不过由于个人是干教育行业的,方方面面的东西,不能说都必须精通,但肯定多少都会涉及到. 一个菜鸟学员,从啥都不会,经过一步步学习,最后到企业上手掌管一个模块甚至一个项目 ...

  3. <实训|第三天>Linux登录界面的修改以及Richard Stallman、自由软件运动

    在写博客之前我想说两点: 承认一个错误,昨天写的实训第二天,我把redhat6.7写成了Linux6.7,感谢热心人士的指出! 昨天写的文章名字太长了,今天改善,内容感觉表述不全,希望各位谅解! 官方 ...

  4. Android实训案例(八)——单机五子棋游戏,自定义棋盘,线条,棋子,游戏逻辑,游戏状态存储,再来一局

    Android实训案例(八)--单机五子棋游戏,自定义棋盘,线条,棋子,游戏逻辑,游戏状态存储,再来一局 阿法狗让围棋突然就被热议了,鸿洋大神也顺势出了篇五子棋单机游戏的视频,我看到了就像膜拜膜拜,就 ...

  5. Android实训案例(四)——关于Game,2048方块的设计,逻辑,实现,编写,加上色彩,分数等深度剖析开发过程!

    Android实训案例(四)--关于Game,2048方块的设计,逻辑,实现,编写,加上色彩,分数等深度剖析开发过程! 关于2048,我看到很多大神,比如医生,郭神,所以我也研究了一段时间,还好是研究 ...

  6. Android实训案例(三)——实现时间轴效果的ListView,加入本地存储,实现恋爱日记的效果!

    Android实训案例(三)--实现时间轴效果的ListView,加入本地存储,实现恋爱日记的效果! 感叹离春节将至,也同时感叹时间不等人,一年又一年,可是我依然是android道路上的小菜鸟,这篇讲 ...

  7. SSM 实训笔记 -11- 使用 Spring MVC + JDBC Template 实现筛选、检索功能(maven)

    SSM 实训笔记 -11- 使用 Spring MVC + JDBC Template 实现筛选.检索功能(maven) 本篇是新建的一个数据库,新建的一个完整项目. 本篇内容: (1)使用 Spri ...

  8. 【C语言期末实训】学生学籍管理系统

    目录: 一,设计要求 ,总体要求: ,具体功能: 二,设计框架 三,程序代码 ,声明函数和头文件 ,声明结构体 ,声明全局变量 ,主体启动函数 ,主菜单函数 ,创建学生档案函数 ,编辑学生档案函数 , ...

  9. JS相关实训

    今天又是无聊的一天,我的脑袋一直在嗡嗡叫,想着一些奇怪的问题,比如我为什么总是感到这么失落,为什么我喜欢的女孩不喜欢我呢,真是头大啊.不过既然有作业了我这个五好公民当然要认真写了.没时间让我思考这么复 ...

  10. vi, Java, Ant, Junit自学报告 - 实训week1

    vi, Java, Ant, Junit自学报告 2017软件工程实训 15331023 陈康怡 vi Vi是linux系统的标准文本编辑器,采用指令的方式进行操作,此处仅记录部分常用的指令. vi模 ...

随机推荐

  1. 因IPv4和IPv6协议不同而引发的第三方接口调用失效的问题

    记录一次因IPv4和IPv6协议不同而引发的第三方接口调用失效的问题,仅供大家参考!!! 背景介绍 公司有一个微信小程序,我做后端的,负责给小程序提供数据接口.后来因为一系列原因小程序要对接一个中控( ...

  2. nginx流量复制与放大

    1. 需求 功能需求 在不影响真实业务前提下,支持: 流量复制,用于线故障分析.系统迁移评估等 流量放大,通过多倍复制,实现放大流量,用于性能压测 配置需求 支持或禁止post请求复制 记录镜像请求的 ...

  3. 数据湖-Hudi/IceBerg

  4. C++实现一个线程安全的map

    本文是使用ChatCPT生成的,最终的代码使用起来没问题.代码是通过两轮对话完善的,后面把对话合并后跑不出理想效果就没尝试了. 第一轮对话 请求 c++11实现一个线程安全的map,使用方法与std: ...

  5. tomcat报错Exception loading sessions from persistent storage解决方案

    现象:项目在重启时报错:严重: Exception loading sessions from persistent storage的问题.该问题的原因是tomcat的session持久化机制引起的, ...

  6. Ubuntu 16.04 配置NFS

    PS:要转载请注明出处,本人版权所有. PS: 这个只是基于<我自己>的理解, 如果和你的原则及想法相冲突,请谅解,勿喷. 前置说明   本文作为本人csdn blog的主站的备份.(Bl ...

  7. 如何用数字人技术让课堂活起来?番职院和3DCAT实时云渲染给出答案

    2023年4月20日,广州市第二届智慧教育成果巡展活动在番禺职业技术学院(下文简称番职院)举行,本次活动的主题是''智能AI助教-让课堂活起来''. 活动现场,瑞云科技受邀展示了其自主研发的瑞云数字人 ...

  8. 调试3D渲染和3D可视化的五个好处

    建筑和建筑环境是我们日常生活中不可避免的一部分,直接影响我们和我们的福祉.它可以是我们的家.办公室.附近的教堂或城市的商业综合体;所有这一切的设计和规划都是建筑.然而,具有讽刺意味的是,建筑的交流往往 ...

  9. TP6框架--EasyAdmin学习笔记:列表调用搜索,开发常见问题记录

    这是我写的学习EasyAdmin的第五章,这一章我给大家分享下列表调用搜索的相关知识,并记录说明下开发时碰到的常见问题 首先说明下如何在页面中调用layui的搜索,效果如下: 代码如下: define ...

  10. 记录--用JS轻松实现一个录音、录像、录屏的工具库

    这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助 前言 最近项目遇到一个要在网页上录音的需求,在一波搜索后,发现了 react-media-recorder 这个库.今天就跟大家一起研究一 ...