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 相关文章推荐
编辑浪子版表单验证类
May 12 Javascript
禁止iframe脚本弹出的窗口覆盖了父窗口的方法
Sep 06 Javascript
javascript操作表格排序实例分析
May 06 Javascript
javascript实现相同事件名称,不同命名空间的调用方法
Jun 26 Javascript
jQuery Validation PlugIn的使用方法详解
Dec 18 Javascript
基于jquery实现ajax无刷新评论
Aug 19 Javascript
JS控制静态页面传递参数并获取参数应用
Aug 10 Javascript
JS实现动态给标签控件添加事件的方法示例
May 13 Javascript
前端html中jQuery实现对文本的搜索功能并把搜索相关内容显示出来
Nov 14 jQuery
基于Vue2的独立构建与运行时构建的差别(详解)
Dec 06 Javascript
详解vue-cli中使用rem,vue自适应
May 06 Javascript
layui 富文本编辑器和textarea值的相互传递方法
Sep 18 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
中国第一家无线电行
2021/03/01 无线电
在WordPress的文章编辑器中设置默认内容的方法
2015/12/29 PHP
Smarty实现页面静态化(生成HTML)的方法
2016/05/23 PHP
PHP数组中头部和尾部添加元素的方法(array_unshift,array_push)
2017/04/10 PHP
PHP自定义函数实现assign()数组分配到模板及extract()变量分配到模板功能示例
2018/05/23 PHP
JS 文件本身编码转换 图文教程
2009/10/12 Javascript
DOM Scripting中的图片切换[兼容Firefox]
2010/06/12 Javascript
基于jQuery实现的图片切换焦点图整理
2014/12/07 Javascript
jQuery中inArray方法注意事项分析
2016/01/25 Javascript
详细总结Javascript中的焦点管理
2016/09/17 Javascript
js仿微信语音播放实现思路
2016/12/12 Javascript
基于JavaScript实现复选框的全选和取消全选
2017/02/09 Javascript
详谈$.data()的用法和作用
2017/02/13 Javascript
js实现导航跟随效果
2018/11/17 Javascript
微信小程序获取复选框全选反选选中的值(实例代码)
2019/12/17 Javascript
openLayer4实现动态改变标注图标
2020/08/17 Javascript
vue3自定义dialog、modal组件的方法
2021/01/04 Vue.js
[06:53]2018DOTA2国际邀请赛寻真——勇于创新的Vici Gaming
2018/08/14 DOTA
[05:59]带你看看DPC的台前幕后
2021/03/11 DOTA
python里大整数相乘相关技巧指南
2014/09/12 Python
python中的lambda表达式用法详解
2016/06/22 Python
Python实现多属性排序的方法
2018/12/05 Python
Django中ORM外键和表的关系详解
2019/05/20 Python
python获取引用对象的个数方式
2019/12/20 Python
python多线程实现代码(模拟银行服务操作流程)
2020/01/13 Python
Python中的None与 NULL(即空字符)的区别详解
2020/09/24 Python
CSS3 真的会替代 SCSS 吗
2021/03/09 HTML / CSS
购买200个世界上最好的内衣品牌:Bare Necessities
2017/02/11 全球购物
英国天然宝石首饰购买网站:Gemondo Jewellery
2018/10/23 全球购物
意大利顶级奢侈品电商:LUISAVIAROMA(支持中文)
2020/05/26 全球购物
门卫工作岗位职责
2013/12/17 职场文书
中层竞聘演讲稿
2014/01/09 职场文书
领导干部查摆“四风”问题自我剖析材料思想汇报
2014/10/05 职场文书
小学生2015教师节演讲稿
2015/03/19 职场文书
毕业酒会致辞
2015/07/29 职场文书
uniapp 微信小程序 自定义tabBar 导航
2022/04/22 Javascript