JS使用parseInt解析数字实现求和的方法


Posted in Javascript onAugust 05, 2015

本文实例讲述了JS使用parseInt解析数字实现求和的方法。分享给大家供大家参考。具体如下:

在网页上使用JavaScript函数中的parseInt解析数字,并求和,有才吧,有空了研究一下。

运行效果如下图所示:

JS使用parseInt解析数字实现求和的方法

具体代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>用parseInt解析数字,并求和</title>
<style> 
body{font:12px/1.5 arial;text-align:center;}
.f-text{width:50px;border:1px solid #ccc;background:#f0f0f0;font-family:inherit;padding:3px;}
span{color:green;padding-right:10px;font-weight:700;}
strong{padding:0 10px;}
</style>
<script type="text/javascript"> 
window.onload = function ()
{
 var aInput = document.getElementsByTagName("input");
 var aSpan = document.getElementsByTagName("span")[0];
 var i = 0;
 for (i = 0; i < aInput.length - 1; i++)
 {
  aInput[i].onkeyup = function ()
  {
   this.value = this.value.replace(/[^\d]/,"")
  } 
 }
 aInput[2].onclick = function ()
 {
  (aInput[0].value == "" || aInput[1].value == "") ?
  alert("请输入数字!") :
  aSpan.innerHTML = parseInt(aInput[0].value) + parseInt(aInput[1].value);
 }
};
</script>
</head>
<body>
<input type="text" class="f-text" /><strong>+</strong><input type="text" class="f-text" /><strong>=</strong><span>?</span><input type="button" value="求和" />
</body>
</html>

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
Javascript remove 自定义数组删除方法
Oct 20 Javascript
jQuery替换字符串(实例代码)
Nov 13 Javascript
jquery与prototype框架的详细对比
Nov 21 Javascript
jQuery实现元素拖拽并cookie保存顺序的方法
Feb 20 Javascript
HTML页面,测试JS对C函数的调用简单实例
Aug 09 Javascript
js实现图片加载淡入淡出效果
Apr 07 Javascript
bootstrap3使用bootstrap datetimepicker日期插件
May 24 Javascript
react 兄弟组件如何调用对方的方法示例
Oct 23 Javascript
vue-router的使用方法及含参数的配置方法
Nov 13 Javascript
js脚本中执行java后台代码方法解析
Oct 11 Javascript
js实现简单的打印表格
Jan 15 Javascript
JavaScript监听键盘事件代码实现
Jun 03 Javascript
js绘制圆形和矩形的方法
Aug 05 #Javascript
JavaScript实现自动消除按钮功能的方法
Aug 05 #Javascript
JS版元素周期表实现方法
Aug 05 #Javascript
javascript实现手机震动API代码
Aug 05 #Javascript
JS实现生成会变大变小的圆环实例
Aug 05 #Javascript
JavaScript计算某一天是星期几的方法
Aug 05 #Javascript
JavaScript实现节点的删除与序号重建实例
Aug 05 #Javascript
You might like
php中设置多级目录session的问题
2011/08/08 PHP
Laravel 5框架学习之用户认证
2015/04/09 PHP
PHP中preg_match函数正则匹配的字符串长度问题
2015/05/27 PHP
浅谈php+phpStorm+xdebug配置方法
2015/09/17 PHP
PHP中获取文件创建日期、修改日期、访问时间的方法
2016/11/05 PHP
thinkphp查询,3.X 5.0方法(亲试可行)
2017/06/17 PHP
js prototype截取字符串函数
2010/04/01 Javascript
Wordpress ThickBox 添加“查看原图”效果代码
2010/12/11 Javascript
jQuery AjaxQueue改进步骤
2011/10/06 Javascript
javascript parseInt() 函数的进制转换注意细节
2013/01/08 Javascript
js实现瀑布流的三种方式比较
2020/06/28 Javascript
JavaScript中将数组进行合并的基本方法讲解
2016/03/07 Javascript
Angular工具方法学习
2016/12/26 Javascript
jQuery使用正则表达式替换dom元素标签用法示例
2017/01/16 Javascript
Js apply方法详解
2017/02/16 Javascript
js input输入百分号保存数据库失败的解决方法
2018/05/26 Javascript
webpack4.x开发环境配置详解
2018/08/04 Javascript
解决vue2.0路由跳转未匹配相应用路由避免出现空白页面的问题
2018/08/24 Javascript
webpack+vue-cil 中proxyTable配置接口地址代理操作
2020/07/18 Javascript
json跨域调用python的方法详解
2017/01/11 Python
Python pandas常用函数详解
2018/02/07 Python
对python中词典的values值的修改或新增KEY详解
2019/01/20 Python
python简单贪吃蛇开发
2019/01/28 Python
Python利用matplotlib绘制约数个数统计图示例
2019/11/26 Python
HTML5梦幻之旅——炫丽的流星雨效果实现过程
2013/08/06 HTML / CSS
日本必酷网络直营店:Biccamera
2019/03/23 全球购物
Kappa英国官方在线商店:服装和运动器材
2020/11/22 全球购物
毕业生实习鉴定
2013/12/11 职场文书
招聘单位介绍信
2014/01/14 职场文书
培训协议书范本
2014/04/22 职场文书
辩论赛新闻稿
2015/07/17 职场文书
趣味运动会简讯
2015/07/20 职场文书
中秋节主题班会
2015/08/14 职场文书
小学语文教学随笔
2015/08/14 职场文书
浅谈Python列表嵌套字典转化的问题
2021/04/07 Python
详解GaussDB for MySQL性能优化
2021/05/18 MySQL