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 题型问答有答案参考
Feb 17 Javascript
Json字符串转换为JS对象的高效方法实例
May 01 Javascript
js实现ArrayList功能附实例代码
Oct 29 Javascript
Jquery技巧(必须掌握)
Mar 16 Javascript
jQuery仿京东商城楼梯式导航定位菜单
Jul 25 Javascript
微信公众平台开发教程(四) 实例入门:机器人回复(附源码)
Dec 02 Javascript
jQuery插件HighCharts绘制2D带Label的折线图效果示例【附demo源码下载】
Mar 08 Javascript
vue+koa2搭建mock数据环境的详细教程
May 18 Javascript
javascript开发实现贪吃蛇游戏
Jul 31 Javascript
Javascript前端下载后台传来的文件流代码实例
Aug 18 Javascript
探究一道价值25k的蚂蚁金服异步串行面试题
Aug 21 Javascript
ajax jquery实现页面某一个div的刷新效果
Mar 04 jQuery
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
mysql5写入和读出乱码解决
2006/11/25 PHP
PHP教程 变量定义
2009/10/23 PHP
php iconv() : Detected an illegal character in input string
2010/12/05 PHP
PHP CLI模式下的多进程应用分析
2013/06/03 PHP
浅析虚拟主机服务器php fsockopen函数被禁用的解决办法
2013/08/07 PHP
PHP获取QQ达人QQ信息的方法
2015/03/05 PHP
php使用函数pathinfo()、parse_url()和basename()解析URL
2016/11/25 PHP
php微信开发之谷歌测距
2018/06/14 PHP
兼容IE和Firefox的javascript获取iframe文档内容的函数
2011/08/15 Javascript
js禁止页面复制功能禁用页面右键菜单示例代码
2013/08/29 Javascript
javascript与Python快速排序实例对比
2015/08/10 Javascript
JS实现带圆弧背景渐变效果的导航菜单代码
2015/10/13 Javascript
jQuery居中元素scrollleft计算方法示例
2017/01/16 Javascript
ECMAScript6--解构
2017/03/30 Javascript
基于JavaScript实现淘宝商品广告效果
2017/08/10 Javascript
JS实现页面内跳转的简单代码
2017/09/03 Javascript
Vue项目部署的实现(阿里云+Nginx代理+PM2)
2019/03/26 Javascript
JS前端知识点总结之内置对象,日期对象和定时器相关操作
2019/07/05 Javascript
vue router 跳转时打开新页面的示例方法
2019/07/28 Javascript
Vue Router的手写实现方法实现
2020/03/02 Javascript
Python中装饰器高级用法详解
2017/12/25 Python
Python爬虫常用小技巧之设置代理IP
2018/09/13 Python
Django使用uwsgi部署时的配置以及django日志文件的处理方法
2019/08/30 Python
OpenCV+Python--RGB转HSI的实现
2019/11/27 Python
Python使用shutil模块实现文件拷贝
2020/07/31 Python
大学军训自我鉴定
2013/12/15 职场文书
旅游管理专业大学生职业规划书
2014/02/27 职场文书
幼儿园大班评语大全
2014/04/17 职场文书
驾驶员培训方案
2014/05/01 职场文书
产品设计开发计划书
2014/05/07 职场文书
HR求职自荐信范文
2014/06/21 职场文书
区域经理岗位职责
2015/02/02 职场文书
2016年9月份红领巾广播稿
2015/12/21 职场文书
幼儿园2016年圣诞活动总结
2016/03/31 职场文书
如何写好活动总结
2019/06/21 职场文书
Pygame如何使用精灵和碰撞检测
2021/11/17 Python