javascript实现的平方米、亩、公顷单位换算小程序


Posted in Javascript onAugust 11, 2014

javascript实现平方米,亩,公顷单位换算,可以通过url传递参数指定输入框的值为任何中单位的值。

源代码如下:

<!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>javascript实现的平方米、亩、公顷单位换算小程序</title>
</head>

<body>

<select onchange="selectChange(this)" id="sel">
<option value="公顷">公顷</option>
<option value="亩">亩</option>
<option value="平方米">平方米</option>
</select>
这个input的值可能是3公顷、3亩、3平方米
<input type="text" value="3" id="input0"/>
<script type="text/javascript">
     var a = parseInt('0'); /////这里改为你动态接受到的值,0代表单位为平方米,1为亩,2为公顷
     var sel = document.getElementById('sel');
     sel.selectedIndex = 2 - a; /////设置单位下拉
     var lastUnit = document.getElementById('sel').value; //记录当前单位
     var input = document.getElementById("input0");
     //10000平米 = 15亩 = 1公顷
     var fRate = {//换算率
       公顷: { 亩: 15, 平方米: 10000 },
       亩: { 平方米: 10000 / 15, 公顷: 1 / 15 },
       平方米: { 亩: 15 / 10000, 公顷: 1 / 10000}
     };
     function selectChange(obj) {//单位改变,执行换算
       var v = parseFloat(input.value);//得到原来的值
       //执行换算,注意fRate的取值,得到上一次的单位节点,再取当前单位的换算率
       var rst = (v * fRate[lastUnit][sel.value]).toFixed(4);//保留4位小数
       input.value = rst;
       lastUnit = sel.value;//更新当前单位变量
     }
</script>

</body>
</html>
Javascript 相关文章推荐
关于IE7 IE8弹出窗口顶上
Dec 22 Javascript
基于jquery的一个简单的脚本验证插件
Apr 05 Javascript
js sort 二维数组排序的用法小结
Jan 24 Javascript
从零学JSON之JSON数据结构
May 19 Javascript
javascript显式类型转换实例分析
Apr 25 Javascript
JavaScript判断数组重复内容的两种方法(推荐)
Jun 06 Javascript
javascript实现table单元格点击展开隐藏效果(实例代码)
Apr 10 Javascript
node.js中express中间件body-parser的介绍与用法详解
May 23 Javascript
JS判断数组那点事
Oct 10 Javascript
Vue中render方法的使用详解
Jan 26 Javascript
vue项目中定义全局变量、函数的几种方法
Nov 08 Javascript
关于IDEA中的.VUE文件报错 Export declarations are not supported by current JavaScript version
Oct 17 Javascript
jquery访问ashx文件示例代码
Aug 11 #Javascript
jQuery实现的一个tab切换效果内部还嵌有切换
Aug 10 #Javascript
JavaScript动态改变HTML页面元素例如添加或删除
Aug 10 #Javascript
网页运行时提示对象不支持abigimage属性或方法
Aug 10 #Javascript
js中直接声明一个对象的方法
Aug 10 #Javascript
点击标签切换和自动切换DIV选项卡
Aug 10 #Javascript
js中window.open打开一个新的页面
Aug 10 #Javascript
You might like
PHP判断文件是否存在、是否可读、目录是否存在的代码
2012/10/03 PHP
windows下zendframework项目环境搭建(通过命令行配置)
2012/12/06 PHP
PHP测试成功的邮件发送案例
2015/10/26 PHP
YII框架批量插入数据的方法
2017/03/18 PHP
PHP基于rabbitmq操作类的生产者和消费者功能示例
2018/06/16 PHP
Centos7 Yum安装PHP7.2流程教程详解
2019/07/02 PHP
用dtree实现树形菜单 dtree使用说明
2011/10/17 Javascript
JS文本框追加多个下拉框的值的简单实例
2013/07/12 Javascript
javascript 函数声明与函数表达式的区别介绍
2013/10/05 Javascript
关于Javascript 对象(object)的prototype
2014/05/09 Javascript
JavaScript优化以及前段开发小技巧
2017/02/02 Javascript
angular实现IM聊天图片发送实例
2017/05/08 Javascript
详解angularjs利用ui-route异步加载组件
2017/05/21 Javascript
JS实现简单短信验证码界面
2017/08/07 Javascript
微信小程序 如何保持登录状态
2019/08/16 Javascript
JsonProperty 的使用方法详解
2019/10/11 Javascript
微信小程序在text文本实现多种字体样式
2019/11/08 Javascript
利用Fn.py库在Python中进行函数式编程
2015/04/22 Python
python编码最佳实践之总结
2016/02/14 Python
Tensorflow使用支持向量机拟合线性回归
2018/09/07 Python
python使用循环打印所有三位数水仙花数的实例
2018/11/13 Python
Python matplotlib通过plt.scatter画空心圆标记出特定的点方法
2018/12/13 Python
基于FME使用Python过程图解
2020/05/13 Python
英国领先的游戏零售商:GAME
2019/09/24 全球购物
会议邀请函范文
2014/01/09 职场文书
开办大学饮食联盟创业计划书
2014/01/29 职场文书
2014年元旦活动方案
2014/02/15 职场文书
搞笑征婚广告词
2014/03/17 职场文书
幼儿园辞职信范文
2015/02/27 职场文书
交通事故调解协议书
2015/05/20 职场文书
幼儿园元旦主持词
2015/07/06 职场文书
教师学习十八届五中全会精神心得体会
2016/01/05 职场文书
Pytest中conftest.py的用法
2021/06/27 Python
MySQL 如何限制一张表的记录数
2021/09/14 MySQL
Nginx stream 配置代理(Nginx TCP/UDP 负载均衡)
2021/11/17 Servers
mysql幻读详解实例以及解决办法
2022/06/16 MySQL