第十四篇 JS实现加减乘除 正则表达式
JS实现加减乘除
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>JS实现一个加减乘除</title>
</head>
<body>
<h3>加减乘除法</h3>
<input placeholder="第一个数字" id="num1" type="text"/>
<select name="fuhao" id="fuhao">
<option value="+">+</option>
<option value="-">-</option>
<option value="*">*</option>
<option value="/">/</option>
</select>
<input placeholder="第二个数字" id="num2" type="text"/>
<button onclick="yunsuan()">运算</button>
<input placeholder="得出结果" id="num3" type="text"/> <script>
function yunsuan(){
//点击事件运行后，获取相关的所有元素id
var num1 = document.getElementById("num1");
var num2 = document.getElementById("num2");
var num3 = document.getElementById("num3");
var fuhao = document.getElementById("fuhao");
// 下面这个是正则表达式，下面这个意思则是，只能输入数字，字数必须有一个及以上
var zhengze = /^[0-9]{1,}$/;
//这里面则是用判断，使用正则的格式，来判断 num1 和num2格式是否正确
if(!zhengze.test(num1.value)){
//老师判断力用了一个 !(叹号)，意思是取相反，它本身成立则会变成不成立
alert('只能输入整数,数字哟');
//判断如果不成立，弹出提示并让代码停止运行，就不往下面走了
return false;
}else if(!zhengze.test(num2.value)){
//else if意思是 否则如果，是在if下面使用的一个判断语句
alert('只能输入整数,数字哟');
return false;
}
//先用判断，判断它的运算符号
//value 是获取它的文本框里的值 select是下拉列表，也可以当做是文本框哦
if(fuhao.value == '+'){
//一个等号是赋值，两个等号才是平常我们作比较说的“等于”
//在JS里，+号不是两个数字相加，而是‘拼接’，将两个数字或者字符串拼接在一起
//这里我们做数字运算，就要用到parseInt方法，就它转化成数字才能相加得出结果
num3.value = parseInt(num1.value)+parseInt(num2.value);
}else if(fuhao.value == '-'){
num3.value = parseInt(num1.value)-parseInt(num2.value);
}else if(fuhao.value == '*'){
num3.value = parseInt(num1.value)*parseInt(num2.value);
}else if(fuhao.value == '/'){
num3.value = parseInt(num1.value)/parseInt(num2.value);
}
}
</body>
</html>
第十四篇 JS实现加减乘除 正则表达式的更多相关文章
- Spring Cloud第十四篇 | Api网关Zuul
本文是Spring Cloud专栏的第十四篇文章,了解前十三篇文章内容有助于更好的理解本文: Spring Cloud第一篇 | Spring Cloud前言及其常用组件介绍概览 Spring C ...
- 解剖SQLSERVER 第十四篇 Vardecimals 存储格式揭秘（译）
解剖SQLSERVER 第十四篇 Vardecimals 存储格式揭秘(译) http://improve.dk/how-are-vardecimals-stored/ 在这篇文章,我将深入研究 ...
- 第十四篇 Integration Services：项目转换
本篇文章是Integration Services系列的第十四篇,详细内容请参考原文. 简介在前一篇,我们查看了SSIS变量,变量配置和表达式管理动态值.在这一篇,我们使用SQL Server数据商业 ...
- Python之路【第十四篇】：AngularJS --暂无内容-待更新
Python之路[第十四篇]:AngularJS --暂无内容-待更新
- 【译】第十四篇 Integration Services：项目转换
本篇文章是Integration Services系列的第十四篇,详细内容请参考原文. 简介在前一篇,我们查看了SSIS变量,变量配置和表达式管理动态值.在这一篇,我们使用SQL Server数据商业 ...
- 跟我学SpringCloud | 第十四篇：Spring Cloud Gateway高级应用
SpringCloud系列教程 | 第十四篇:Spring Cloud Gateway高级应用 Springboot: 2.1.6.RELEASE SpringCloud: Greenwich.SR1 ...
- SpringBoot第二十四篇：应用监控之Admin
作者:追梦1819 原文:https://www.cnblogs.com/yanfei1819/p/11457867.html 版权声明:本文为博主原创文章,转载请附上博文链接! 引言 前一章(S ...
- Egret入门学习日记 --- 第十四篇（书中 5.4~5.6节 内容）
第十四篇(书中 5.4~5.6节 内容) 书中内容: 总结 5.4节 内容重点: 1.如何编写自定义组件? 跟着做: 重点1:如何编写自定义组件? 文中提到了重要的两点. 好,我们来试试看. 第一步, ...
- Hibernate（十四篇）
(一)Hibernate简介 (二)hibernate配置管理 (三)Hibernate对象-关系映射文件 (四)Hibernate API详解 (五)Hibernate一级缓存 (六)Hiberna ...
随机推荐
- iOS即时通讯之CocoaAsyncSocket源码解析三
原文 前言 本文实例Github地址:即时通讯的数据粘包.断包处理实例. 本文旨以实例的方式,使用CocoaAsyncSocket这个框架进行数据封包和拆包.来解决频繁的数据发送下,导致的数据粘包.以 ...
- 凸包Graham Scan算法实现
凸包算法实现点集合中搜索凸包顶点的功能,可以处理共线情况,可以输出共线点也可以不输出而只输出凸包顶点.经典的Graham Scan算法,点排序使用极角排序方式,并对共线情况做特殊处理.一般算法是将共线 ...
- linux用户和组账户管理
linux操作系统是一个多用户操作系统,它允许多用户同时登录到系统上并使用资源.系统会根据账户来区分每个用户的文件,进程,任务和工作环境,使得每个用户工作都不受干扰. 用户账户 A．普通用户账户:普通 ...
- php安装compoer install
1.先确定php运行版本为7.1以上 2.在phpstorm中 或者在项目根目录按住shift+有单击点击“在此处打开命令窗口”运行composer install 3出现这个证明安装成功 . 会遇到 ...
- mac 安装photoshop + 破解
项目开发中毫无疑问会用到图片,一般情况都是UI将图片切好的,只是,有时候项目中少了一张图片或者是改变图片的尺寸之类的问题,这里我们就不需要每次都找UI要图片了,作为程序员这些基础工具的使用,咱们还是要 ...
- nhibernate Stuty
https://blog.csdn.net/u010371458/article/details/8995166 翻译版 https://wenku.baidu.com/view/46fa56cea1 ...
- TensorFlow 用神经网络解决非线性问题
本节涉及点: 激活函数 sigmoid 产生随机训练数据 使用随机训练数据训练 加入偏移量b加快训练过程 进阶:批量生产随机训练数据 在前面的三好学生问题中,学校改变了评三好的标准 —— 总分> ...
- 【MM系列】SAP ABAP 编辑字段出现：对象编辑中的错误
公众号:SAP Technical 本文作者:matinal 原文出处:http://www.cnblogs.com/SAPmatinal/ 原文链接:[ABAP系列]SAP ABAP 编辑字段出现: ...
- 流程控制，循环结构，for,while循环
'''1.变量名命名规范 -- 1.只能由数字.字母 及 _ 组成 -- 2.不能以数字开头 -- 3.不能与系统关键字重名 -- 4._开头有特殊含义 -- 5.__开头__结尾的变量,魔法变量 - ...
- ubuntu 编译安装 svn
1,简单的安装svn (1) sudo apt-get install subversion 但是此种方式,可能不能安装到当前最新的svn.如当前最新的版本是svn 1.8.9 ,但是 通过此种安装 ...