js实现网页的两个input标签内的数值加减(示例代码)
实例如下所示:
<!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标签内的数值加减(示例代码)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们。
相关推荐
-
javascript实现一个数值加法函数
废话不多说,直接奉上代码 JS <script type="text/javascript"> function Sum(arg1,arg2){ //数值加法函数 var sarg1 = new String(arg1); //将传入的参数转为字符串以便进行参数检查 var sarg2 = new String(arg2); //将参数2转为字符类型 if( (sarg1=="")||(sarg2=="") ) //确保参数不为空 {
-
js实现文本框支持加减运算的方法
本文实例讲述了js实现文本框支持加减运算的方法.分享给大家供大家参考.具体如下: 这是一个网页表单效果,让表单内的文本框支持加减运算,不过你要按正确的运算式输入,要不然它没有那么智能哦,比如输入1+5,文本框旁边会显示计算结果,这要归功于JavaScript的功能. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-math-input-method-codes/ 具体代码如下: <!DOCTYPE html PUBLIC "-//W3
-
js实现网页的两个input标签内的数值加减(示例代码)
实例如下所示: <!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
-
JS操作input标签属性checkbox全选的实现代码
废话不多说了,具体代码如下所示: <html> <head> < > function selectAll(){ var checklist = document.getElementsByName ("selected");//获取所有name值为selected的标签 if(document.getElementById("controlAll").checked){//判断当id为controlAll的标签是否被选中 for
-
JS控件ASP.NET的treeview控件全选或者取消(示例代码)
复制代码 代码如下: <script language="javascript"> /* 函数名称:CheckNode(currentNode).ParentNode(currentNode).ChildNode(currentNode) 函数功能:实现带checkbox的treeview中 1.选中父结点其子结点也全部选中 2.取消全部子结点的选择后,父结点的选择也随之取消 使用方法:1.在<head></head>中间添加Chec
-
js取两个数组的交集|差集|并集|补集|去重示例代码
复制代码 代码如下: /** * each是一个集合迭代函数,它接受一个函数作为参数和一组可选的参数 * 这个迭代函数依次将集合的每一个元素和可选参数用函数进行计算,并将计算得的结果集返回 {%example <script> var a = [1,2,3,4].each(function(x){return x > 2 ? x : null}); var b = [1,2,3,4].each(function(x){return x < 0 ? x : null}); alert
-
js清除input中type等于file的值域(示例代码)
如下所示;var objFile = document.getElementById('fileID');objFile.outerHTML=objFile.outerHTML.replace(/(value=\").+\"/i,"$1\"");
-
快速实现JS图片懒加载(可视区域加载)示例代码
js懒加载图片 如何提高网页加载速度?在网页中有许多img标签,这些标签就是图片,其属性src则是指向服务器地址,当浏览器从上往下读取到src标签中的地址时,浏览器就会开启线程,加载这张图片.而并不是等到整张页面都解析完成才加载图片.我们要做的就是加载用户可视范围内的图片. js懒加载图片的目的 1.网页优化,提高网页加载速度 2.页面优化友好,提高SEO收录与排名 3.提高用户体验,减少服务器压力 实例代码如下: <!DOCTYPE html> <html lang="en&
-
文本框(input)获取焦点(onfocus)时样式改变的示例代码
摘要:许多重视用户体验的设计师都希望给文本框(input)加上获取焦点或者鼠标悬停时的样式切换效果.其实很简单,我们只需要获取页面上的文本框,加上onfocus事件或者其他对应的事件即可.本文介绍了如何在获取焦点时切换样式,明白原理后,实现其他效果就很简单了. 许多重视用户体验的设计师都希望给文本框(input)加上获取焦点或者鼠标悬停时的样式切换效果.其实很简单,我们只需要获取页面上的文本框,加上onfocus事件或者其他对应的事件即可.本文介绍了如何在获取焦点时切换样式,明白原理后,实现其他
-
JS禁止浏览器右键查看元素或按F12审查元素自动关闭页面示例代码
前言 很多站长为了仿止别人仿制或扒下自己的网页,都会选择使用禁止浏览器右键查看元素或F12审查元素,一旦查看元素浏览器页面就会自动关闭,下面话不多说了,来一起看看详细的介绍吧. 注:该代码不兼容火狐浏览器,对于一些小白还是有用的. javascript实现代码: <script type="text/javascript"> function fuckyou(){ window.close(); //关闭当前窗口(防抽) window.location="abou
-
手机端网页点击链接触发自动拨打或保存电话的示例代码
通过网页拨打电话 <a href="tel://110 ">拨打电话</a> 这种方式塞班.安卓与iphone都支持 切记一定这这么写,不要自己写方法再去调用 例如;<a href="javascript:phone('+phone+') ">拨打电话</a> function phone(date){ window.location.href = 'tel://' + date; } 这样写IOS不兼容
-
input 标签实现输入框带提示文字效果(两种方法)
方法一:html5配合css3实现带提示文字的输入框(摆脱js): webkit特有的一个css,可以控制里面的文字样式,配合css3的动画效果和伪类,我们就可以很容易做出一个带动画的输入框,在系统登录.搜索等位置很适合,感兴趣的你可以参考下本文或许可以帮助到你,Webkit作为载体开发系统,当然需要大量使用Html5与CSS3,不仅减少大量的JS还可以保证更流畅. 当选中对话框后,提示文字变浅色,输入后消失.这个现在通行的做法是在Input标签后面增加一个Label.使用JS控制. HTML5
随机推荐
- asp网页邮箱访问
- jQuery实现鼠标跟随效果
- iOS UITextView 首行缩进 撤销输入 反撤销输入的实现代码
- Perl操作系统环境变量的脚本代码
- 一个JavaScript的求爱小特效
- 在Python中操作日期和时间之gmtime()方法的使用
- C#使用LitJson解析JSON的示例代码
- C/C++中输入多组数据的方法
- vue.js+Element实现表格里的增删改查
- 每日十条JavaScript经验技巧(一)
- 为Python程序添加图形化界面的教程
- python字符串的常用操作方法小结
- js模拟jquery的slide和fadeIn和fadeOut功能
- nginx 伪静态化rewrite规则
- SQL四舍五入、向下取整、向上取整函数介绍
- jQuery的Read()方法代替原生JS详解
- Apache配置参数deny和allow的使用实例
- java在pdf中生成表格的方法
- Android实现蒙板效果
- 详解android webView独立进程通讯方式