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 01 Javascript
js open() 与showModalDialog()方法使用介绍
Sep 10 Javascript
JavaScript中按位“异或”运算符使用介绍
Mar 14 Javascript
jQuery实现异步获取json数据的2种方式
Aug 29 Javascript
js实现屏幕自适应局部代码分享
Jan 30 Javascript
JS返回iframe中frameBorder属性值的方法
Apr 01 Javascript
js实现鼠标左右移动,图片也跟着移动效果
Jan 25 Javascript
js实现兼容PC端和移动端滑块拖动选择数字效果
Feb 16 Javascript
JS的函数调用栈stack size的计算方法
Jun 24 Javascript
深入了解Hybrid App技术的相关知识
Jul 17 Javascript
微信公众号中的JSSDK接入及invalid signature等常见错误问题分析(全面解析)
Apr 11 Javascript
vue3.0生命周期的示例代码
Sep 24 Javascript
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,js双版本
2012/09/25 PHP
php分页代码学习示例分享
2014/02/20 PHP
PHP+Oracle本地开发环境搭建方法详解
2019/04/01 PHP
JS动态添加option和删除option(附实例代码)
2013/04/01 Javascript
JQuery for与each性能比较分析
2013/05/14 Javascript
jquery获取一组checkbox的值(实例代码)
2013/11/04 Javascript
jQuery检测鼠标左键和右键点击的方法
2015/03/17 Javascript
jQuery判断元素上是否绑定了指定事件的方法
2015/03/17 Javascript
JQuery中基础过滤选择器用法实例分析
2015/05/18 Javascript
js+HTML5实现canvas多种颜色渐变效果的方法
2015/06/05 Javascript
JS div匀速移动动画与变速移动动画代码实例
2019/03/26 Javascript
深入理解JS异步编程-Promise
2019/06/03 Javascript
解决vue+ element ui 表单验证有值但验证失败问题
2020/01/16 Javascript
详解Vue2的diff算法
2021/01/06 Vue.js
Python open读写文件实现脚本
2008/09/06 Python
python基础教程之popen函数操作其它程序的输入和输出示例
2014/02/10 Python
python读取文本中的坐标方法
2018/10/14 Python
python paramiko利用sftp上传目录到远程的实例
2019/01/03 Python
Python开发网站目录扫描器的实现
2019/02/21 Python
Python之NumPy(axis=0 与axis=1)区分详解
2019/05/27 Python
Python 实现大整数乘法算法的示例代码
2019/09/17 Python
解决Python中回文数和质数的问题
2019/11/24 Python
np.dot()函数的用法详解
2020/01/17 Python
Selenium基于PIL实现拼接滚动截图
2020/04/10 Python
在python中使用nohup命令说明
2020/04/16 Python
浅析数据存储的三种方式 cookie sessionstorage localstorage 的异同
2020/06/04 HTML / CSS
SKECHERS官方旗舰店:美国舒适运动休闲品牌
2017/12/22 全球购物
洛杉矶时尚女装系列:J.ING US
2019/03/17 全球购物
英国的一家创新礼品和小工具零售商:Menkind
2019/08/24 全球购物
周鸿祎:教你写创业计划书
2013/12/30 职场文书
业务部经理岗位职责
2014/01/04 职场文书
北京大学自荐信范文
2014/01/28 职场文书
2014小学教师个人工作总结
2014/11/10 职场文书
和谐拯救危机观后感
2015/06/15 职场文书
怎样写好工作计划
2019/04/10 职场文书
2019年最新版见习人员管理制度!
2019/07/08 职场文书