js小功能3:一个简单的计算器功能

html:
<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' />
js:
<script>
function count(){
var vtxt1=parseInt(document.getElementById('txt1').value);
var vtxt2=parseInt(document.getElementById('txt2').value);
var vselect=document.getElementById('select').value;
var result='';
switch (vselect){
case '+':{
result=vtxt1+vtxt2; break;
}
case '-':{
result=vtxt1-vtxt2; break;
}
case '*':{
result=vtxt1*vtxt2; break;
}
case '/':{
result=vtxt1/vtxt2; break;
}
}
document.getElementById('fruit').value=result
}
</script>
js小功能3:一个简单的计算器功能的更多相关文章
- JS事件 编程练习-自制计算器 使用JS完成一个简单的计算器功能。实现2个输入框中输入整数后,点击第三个输入框能给出2个整数的加减乘除。
编程练习 使用JS完成一个简单的计算器功能.实现2个输入框中输入整数后,点击第三个输入框能给出2个整数的加减乘除. 提示:获取元素的值设置和获取方法为:例:赋值:document.getElement ...
- js eval函数写一个简单的计算器
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- JS实现一个简单的计算器
使用JS完成一个简单的计算器功能.实现2个输入框中输入整数后,点击第三个输入框能给出2个整数的加减乘除.效果如上: 第一步: 创建构建运算函数count(). 第二步: 获取两个输入框中的值和获取选择 ...
- Android下实现一个简单的计算器源码
下面的内容是关于Android下实现一个简单的计算器的内容. import android.app.Activity; import android.os.Bundle;import android. ...
- 用node.js从零开始去写一个简单的爬虫
如果你不会Python语言,正好又是一个node.js小白,看完这篇文章之后,一定会觉得受益匪浅,感受到自己又新get到了一门技能,如何用node.js从零开始去写一个简单的爬虫,十分钟时间就能搞定, ...
- React.js 小书 Lesson16 - 实战分析:评论功能(三)
作者:胡子大哈 原文链接:http://huziketang.com/books/react/lesson16 转载请注明出处,保留原文链接和作者信息. 接下来的代码比较顺理成章了.修改 Commen ...
- React.js 小书 Lesson14 - 实战分析:评论功能(一)
作者:胡子大哈 原文链接:http://huziketang.com/books/react/lesson14 转载请注明出处,保留原文链接和作者信息. 课程到这里大家已经掌握了 React.js 的 ...
- IOS开发之小实例--创建一个简单的用于视频录制和回放的应用程序
前言:还是看了一下国外的入门IOS文章:<Create a Simple App for Video Recording and Playback>,主要涉及视频录制和回放的功能的基本实现 ...
- 用JavaScript写一个简单的计算器
本文使用js实现了一个简单的加.减.乘.除计算器. 以下是css部分代码: *{ padding:0; margin:0; color: #424242; } .outer{ width:300px; ...
随机推荐
- 动态绑定v-model
<template> <div class="pieAll" > <template v-for="(item, index) in tes ...
- 史上最全最详细JNDI数据源配置说明
转: 史上最全最详细JNDI数据源配置说明 2017年08月05日 17:12:08 万米高空 阅读数 23983 版权声明:本文为博主原创文章,转载请注明出处,尊重劳动成果,谢谢~ https: ...
- openstack compute service list Unable to establish connection to http://controller:8774/v2.1/os-services: ('Connection aborted.', BadStatusLine("''",))
8774是nova的端口号,所以我就逐一查看nova的日志文件. tail -f /var/log/nova/nova-conductor.log 2019-06-13 08:24:53.559 44 ...
- 实时更新Excel文档外部数据源的数据
实时更新Excel文档外部数据源的数据 单元格区域.Excel 表.数据透视表或数据透视图均可以连接到外部数据源(数据源:用于连接数据库的一组存储的"源"信息.数据源包含数据库服务 ...
- Java日志体系(一)发展历程
一.日志框架的分类 门面型日志框架: JCL: Apache基金会所属的项目,是一套Java日志接口,之前叫Jakarta Commons Logging,后更名为Commons Logging SL ...
- 转载:深入浅出 Java 8 Lambda 表达式
原文地址:http://viralpatel.net/blogs/Lambda-expressions-java-tutorial/ OneAPM for Java 能够深入到所有 Java 应用内部 ...
- Python 面向对象(上)
一. 什么是面向对象? 1. 在了解面向对象之前,首先我们需要知道两个概念:(1)什么是函数?函数是对功能或动作的一种封装.函数的语法结构如下: def func(arg1): '''函数的内部有函数 ...
- 【HTML】常用的标签学习(2)
现在的使用的html语言都是h5,但是h5也是从h4继承发展来的,所以h4的标签我们也要学习,然后加上h5新增的标签,那么html这门语言才算学习完毕.上次学习了h4的一些常用标签,今天学习h4剩下的 ...
- MariaDB知识点总结03--从主+多主集群
一.从主架构 1.从主复制原理 从库生成两个线程,一个I/O线程,一个SQL线程: i/o线程去请求主库 的binlog,并将得到的binlog日志写到relay log(中继日志) 文件中:主库会生 ...
- 生成器的send方法、递推函数、匿名函数及常用内置函数
生成器的send方法 在使用yield方法创建生成器时,不仅可以使用next方法进行取值,还可以通过send方法向生成器的内部传值 什么是send方法? send方法相当于高级的next方法,send ...