纯js代码实现简单计算器
更新时间：2015年12月02日 11:14:42 投稿：lijiao
这篇文章主要介绍了纯js代码实现简单计算器，功能超简单，实现加减乘除简单运算，感兴趣的小伙伴们可以参考一下
本文实例分享了纯js代码实现简单计算器代码，相信大家会喜欢。具体如下：
运行效果截图如下：
具体代码如下：
<!DOCTYPE html>
<html>
<head>
<title> new document </title>
<script type="text/javascript">
function count(){
var txt1 = parseInt( document.getElementById('txt1').value);//获取第一个输入框的值
var txt2 = parseInt( document.getElementById('txt2').value);//获取第二个输入框的值
var select = document.getElementById('select').value;//获取选择框的值
var result = '';
switch (select)
{
case '+':
result = txt1 + txt2;
break;
case '-':
result = txt1 - txt2;
break;
case '*':
result = txt1 * txt2;
break;
case '/':
result = txt1 / txt2;
break;
}
document.getElementById('fruit').value = result;//设置结果输入框的值
}
</script>
</head>
<body>
<input type='text' id='txt1' />
<select id='select'>
<option value='+'>+</option>
<option value="-">-</option>
<option value="*">*</option>
<option value="/">/</option>
</select>
<input type='text' id='txt2' />
<input type='button' value=' = ' onclick = "count()" /> <!--通过 = 按钮来调用创建的函数，得到结果-->
<input type='text' id='fruit' />
</body>
</html>
复制粘贴上方代码即可实现简单的计算器功能，希望本文所述对大家学习javascript程序设计有所帮助。
相关文章
本文主要介绍了JavaScript 短路运算的实现，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2022-06-06
这篇文章主要介绍了javascript中的return和闭包函数浅析,至少可以让你搞懂那么多()是什么意思,需要的朋友可以参考下2014-06-06
JavaScript通过prototype给对象定义属性用法实例
这篇文章主要介绍了JavaScript通过prototype给对象定义属性用法,实例分析了prototype的功能及使用技巧,具有一定参考借鉴价值,需要的朋友可以参考下2015-03-03
这篇文章主要介绍了关于微信jssdk实现多图片上传的一点心得分享,非常不错，具有参考借鉴价值，需要的朋友可以参考下2016-12-12
Math 是javaScript的内置对象，包含了部分数学常数属性和数学函数方法。本文将详细讲解Math基本方法的使用，感兴趣的小伙伴可以学习一下2022-04-04
这篇文章主要介绍了通过javascript实现段落的收缩与展开,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下2019-06-06
这篇文章主要给大家介绍了关于JavaScript日期和时间的格式化及其它常用处理方法,JavaScript中可以使用Date对象来表示日期和时间,如果需要格式化日期和时间,可以使用Date对象的几个方法和一些字符串操作方法来实现,需要的朋友可以参考下2023-09-09
最近由于公司需要研究了一下微信小程序的开发,特此记录一下小程序登录授权的流程,便于自己理解,也希望对他人有多帮助,下面这篇文章主要给大家介绍了关于微信小程序授权登录的最新实现方案的相关资料,需要的朋友可以参考下2023-02-02
本文主要介绍了JavaScript中let与const命令使用，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2022-07-07
这篇文章主要给大家介绍了关于微信小程序购物车、父子组件传值及calc的注意事项的相关资料，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2018-11-11
最新评论