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 相关文章推荐
表单提交验证类
Jul 14 Javascript
js一组验证函数
Dec 20 Javascript
JQuery select标签操作代码段
May 16 Javascript
js 获取(接收)地址栏参数值的方法
Apr 01 Javascript
js 得到文件后缀(通过正则实现)
Jul 08 Javascript
JavaScript改变HTML元素的样式改变CSS及元素属性
Nov 12 Javascript
JQuery radio(单选按钮)操作方法汇总
Apr 15 Javascript
jquery结婚电子请柬特效源码分享
Aug 21 Javascript
jquery实现的Banner广告收缩效果代码
Sep 02 Javascript
一种Javascript解释ajax返回的json的好方法(推荐)
Jun 02 Javascript
JS实现的类似微信聊天效果示例
Jan 29 Javascript
vue+iview实现文件上传
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 socket(fsockopen)的应用实例分析
2013/06/02 PHP
php一个文件搞定微信jssdk配置
2016/12/12 PHP
PHP编程求最大公约数与最小公倍数的方法示例
2017/05/29 PHP
javascript 折半查找字符在数组中的位置(有序列表)
2010/12/09 Javascript
TBCompressor js代码压缩
2011/01/05 Javascript
纯JAVASCRIPT图表动画插件Highcharts Examples
2011/04/16 Javascript
30个经典的jQuery代码开发技巧
2014/12/15 Javascript
js控制页面的全屏展示和退出全屏显示的方法
2015/03/10 Javascript
深入探讨javascript函数式编程
2015/10/11 Javascript
Node之简单的前后端交互(实例讲解)
2017/11/14 Javascript
js判断数组是否包含某个字符串变量的实例
2017/11/24 Javascript
利用JS判断客户端类型你应该知道的四种方法
2017/12/22 Javascript
详解微信小程序自定义组件的实现及数据交互
2019/07/22 Javascript
Vue使用mixin分发组件的可复用功能
2019/09/01 Javascript
浅谈JS中几种轻松处理'this'指向方式
2019/09/16 Javascript
JQuery复选框全选效果如何实现
2020/05/08 jQuery
使用next.js开发网址缩短服务的方法
2020/06/17 Javascript
vue 动态设置img的src地址无效,npm run build 后找不到文件的解决
2020/07/26 Javascript
[43:58]DOTA2上海特级锦标赛C组败者赛 Newbee VS Archon第二局
2016/02/27 DOTA
[00:35]DOTA2上海特级锦标赛 VP战队宣传片
2016/03/04 DOTA
[40:55]Liquid vs LGD 2018国际邀请赛小组赛BO2 第二场 8.16
2018/08/17 DOTA
[01:04:20]完美世界DOTA2联赛PWL S2 LBZS vs Forest 第一场 11.29
2020/12/02 DOTA
Python中的一些陷阱与技巧小结
2015/07/10 Python
Python常见字符串操作函数小结【split()、join()、strip()】
2018/02/02 Python
浅析python的优势和不足之处
2018/11/20 Python
python实现两个文件夹的同步
2019/08/29 Python
Python SSL证书验证问题解决方案
2020/01/13 Python
一张图片能隐含千言万语之隐藏你的程序代码
2012/12/13 HTML / CSS
办公室秘书岗位职责范本
2014/02/11 职场文书
企业演讲比赛主持词
2014/03/18 职场文书
大学生自我鉴定书
2014/03/24 职场文书
感恩老师的演讲稿
2014/05/06 职场文书
2015年教务工作总结
2015/05/23 职场文书
2016暑期社会实践新闻稿
2015/11/25 职场文书
聊聊mysql都有哪几种分区方式
2022/04/13 MySQL
Python日志模块logging用法
2022/06/05 Python