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 相关文章推荐
JavaScript 乱码问题
Aug 06 Javascript
纯js分页代码(简洁实用)
Nov 05 Javascript
js window.open弹出新的网页窗口
Jan 16 Javascript
JS小游戏之仙剑翻牌源码详解
Sep 25 Javascript
谈一谈jQuery核心架构设计
Mar 28 Javascript
一步一步封装自己的HtmlHelper组件BootstrapHelper(二)
Sep 14 Javascript
JavaScript 限制文本框不可输入英文单双引号的方法
Dec 20 Javascript
Javascript DOM事件操作小结(监听鼠标点击、释放,悬停、离开等)
Jan 20 Javascript
vue中遇到的坑之变化检测问题(数组相关)
Oct 13 Javascript
TypeScript开发Node.js程序的方法
Apr 30 Javascript
细述Javascript的加法运算符的具体使用
Oct 18 Javascript
推荐几个不错的console调试技巧实现
Dec 20 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+mysql实现无限级分类 | 树型显示分类关系
2006/11/19 PHP
PHP中if和or运行效率对比
2014/12/12 PHP
PHP实现将多个文件中的内容合并为新文件的方法示例
2017/06/10 PHP
Yii2框架实现登录、退出及自动登录功能的方法详解
2017/10/24 PHP
Laravel框架模板继承操作示例
2018/06/11 PHP
Add Formatted Text to a Word Document
2007/06/15 Javascript
javascript hashtable实现代码
2009/10/13 Javascript
JS与框架页的操作代码
2010/01/17 Javascript
JavaScript CSS修改学习第二章 样式
2010/02/19 Javascript
jQuery Validation插件remote验证方式的Bug解决
2010/07/01 Javascript
jquery实现居中弹出层代码
2010/08/25 Javascript
js实现目录定位正文示例
2013/11/14 Javascript
jQuery处理xml格式的返回数据(实例解析)
2013/11/28 Javascript
jQuery获取table行数并输出单元格内容的实现方法
2016/06/30 Javascript
JS 实现导航菜单中的二级下拉菜单的几种方式
2016/10/31 Javascript
bootstrap响应式表格实例详解
2017/05/15 Javascript
纯js实现画一棵树的示例
2017/09/05 Javascript
jQuery阻止事件冒泡实例分析
2018/07/03 jQuery
解决node-sass偶尔安装失败的方法小结
2018/12/05 Javascript
深入了解Vue3模板编译原理
2020/11/19 Vue.js
python赋值操作方法分享
2013/03/23 Python
Python文件夹与文件的操作实现代码
2014/07/13 Python
python调用机器喇叭发出蜂鸣声(Beep)的方法
2015/03/23 Python
python redis连接 有序集合去重的代码
2019/08/04 Python
详解Django配置JWT认证方式
2020/05/09 Python
Django的ListView超详细用法(含分页paginate)
2020/05/21 Python
CSS3等相关属性制作分页导航实现代码
2012/12/24 HTML / CSS
美国真皮手袋品牌:GiGi New York
2017/03/10 全球购物
美国轮胎网站:Priority Tire
2018/11/28 全球购物
法国包包和行李箱销售网站:Bagage24.fr
2020/03/24 全球购物
八皇后问题,输出了所有情况,不过有些结果只是旋转了90度
2016/08/15 面试题
办公自动化专业大学生职业规划书
2014/03/06 职场文书
品牌宣传方案
2014/03/21 职场文书
超市主管竞聘书
2015/09/15 职场文书
golang DNS服务器的简单实现操作
2021/04/30 Golang
CSS3实现指纹特效代码
2022/03/17 HTML / CSS