js实现网页的两个input标签内的数值加减(示例代码)


Posted in Javascript onAugust 15, 2017

实例如下所示:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script>
window.onload=function(){

var oIput1=document.getElementById('put1');
var oIput2=document.getElementById('put2');
var nAdd=document.getElementById('add');
var nSub=document.getElementById('subtraction');


nAdd.onclick=function(){
var a=Number(oIput1.value);
var b=Number(oIput2.value);
c = a+b;
alert(c);
}
nSub.onclick=function(){
var a=Number(oIput1.value);
var b=Number(oIput2.value);
c = a-b;
alert(c);
}
}

</script>
</head>
<body>

数值1:<input id="put1" type="text" value=""/>
数值2:<input id="put2" type="text" value=""/>
<input type="button" id="add" value="求和" />
<input type="button" id="subtraction" value="相减" />

</body>
</html>

下面是效果图 ↓

js实现网页的两个input标签内的数值加减(示例代码)

以上这篇js实现网页的两个input标签内的数值加减(示例代码)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
ie6下png图片背景不透明的解决办法使用js实现
Jan 11 Javascript
JS中setInterval、setTimeout不能传递带参数的函数的解决方案
Apr 28 Javascript
js控制input输入字符解析
Dec 27 Javascript
JS基于FileSystemObject创建一个指定路径的TXT文本文件
Aug 05 Javascript
浅析$.getJSON异步请求和同步请求
Jun 06 Javascript
JQuery组件基于Bootstrap的DropDownList(完整版)
Jul 05 Javascript
VUE中使用Vue-resource完成交互
Jul 21 Javascript
js实现微信/QQ直接跳转到支付宝APP打开口令领红包功能
Jan 09 Javascript
JavaScript函数式编程(Functional Programming)箭头函数(Arrow functions)用法分析
May 22 Javascript
JavaScript实现五子棋游戏的方法详解
Jul 08 Javascript
p5.js实现故宫橘猫赏秋图动画
Oct 23 Javascript
vue中 this.$set的使用详解
Nov 17 Vue.js
JScript实现地址选择功能
Aug 15 #Javascript
jQuery实现腾讯信用界面(自制刻度尺)样式
Aug 15 #jQuery
关于vue.js发布后路径引用的问题解决
Aug 15 #Javascript
JavaScript中使用Async实现异步控制
Aug 15 #Javascript
使用jQuery实现购物车结算功能
Aug 15 #jQuery
javascript兼容性(实例讲解)
Aug 15 #Javascript
清空元素html(&quot;&quot;) innerHTML=&quot;&quot; 与 empty()的区别和应用(推荐)
Aug 14 #Javascript
You might like
黑夜路人出的几道php笔试题
2009/08/04 PHP
PHP mkdir()无写权限的问题解决方法
2014/06/19 PHP
php实现的发送带附件邮件类实例
2014/09/22 PHP
PHP删除二维数组中相同元素及数组重复值的方法示例
2017/05/05 PHP
laravel框架数据库操作、查询构建器、Eloquent ORM操作实例分析
2019/12/20 PHP
javascript 跳转代码集合
2009/12/03 Javascript
JavaScript实现自己的DOM选择器原理及代码
2013/03/04 Javascript
JS随机漂浮广告代码具体实例
2013/11/19 Javascript
jquery实现简单易懂的图片展示小例子
2013/11/21 Javascript
extjs每个组件要设置唯一的ID否则会出错
2014/06/15 Javascript
javascript动态获取登录时间和在线时长
2016/02/25 Javascript
JS将unicode码转中文方法
2017/05/08 Javascript
vue获取DOM元素并设置属性的两种实现方法
2017/09/30 Javascript
JavaScript数组去重算法实例小结
2018/05/07 Javascript
详解Angular6.0使用路由步骤(共7步)
2018/06/29 Javascript
JS实现获取当前所在周的周六、周日示例分析
2019/05/11 Javascript
vue 实现cli3.0中使用proxy进行代理转发
2019/10/30 Javascript
JS轮播图的实现方法
2020/08/24 Javascript
JS页面动态绘图工具SVG,Canvas,VML介简介
2020/10/16 Javascript
js实现简易点击切换显示或隐藏
2020/11/29 Javascript
[01:05:56]Liquid vs VP Supermajor决赛 BO 第二场 6.10
2018/07/04 DOTA
python正常时间和unix时间戳相互转换的方法
2015/04/23 Python
Python统计日志中每个IP出现次数的方法
2015/07/06 Python
Python中防止sql注入的方法详解
2017/02/25 Python
Keras 实现加载预训练模型并冻结网络的层
2020/06/15 Python
你需要学会的8个Python列表技巧
2020/06/24 Python
美国女鞋品牌:naturalizer(娜然)
2016/08/01 全球购物
美国最大的半成品净菜电商:Blue Apron(蓝围裙)
2018/04/27 全球购物
2019年.net常见面试问题
2012/02/12 面试题
大学生饮食连锁店创业计划书
2014/01/17 职场文书
经济担保书范文
2014/04/02 职场文书
2014年保卫工作总结
2014/12/05 职场文书
关于html选择框创建占位符的问题
2021/06/09 HTML / CSS
golang 实用库gotable的具体使用
2021/07/01 Golang
python数字类型和占位符详情
2022/03/13 Python
shell进度条追踪指令执行时间的场景分析
2022/06/16 Servers