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 相关文章推荐
in.js 一个轻量级的JavaScript颗粒化模块加载和依赖关系管理解决方案
Jul 26 Javascript
js用Date对象的setDate()函数对日期进行加减操作
Sep 18 Javascript
jQuery移除tr无效的解决方法(tr是动态添加)
Sep 22 Javascript
javascript每日必学之封装
Feb 23 Javascript
JS判断字符串字节数并截取长度的方法
Mar 05 Javascript
Bootstrap时间选择器datetimepicker和daterangepicker使用实例解析
Sep 17 Javascript
关于angularJs指令的Scope(作用域)介绍
Oct 25 Javascript
JavaScript中return用法示例
Nov 29 Javascript
vue+vuecli+webpack中使用mockjs模拟后端数据的示例
Oct 24 Javascript
图文讲解vue的v-if使用方法
Feb 11 Javascript
js控制随机数生成概率代码实例
Mar 21 Javascript
vue中监听返回键问题
Aug 28 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
德劲1102收音机的打理维修案例
2021/03/02 无线电
网站当前的在线人数
2006/10/09 PHP
php 文件下载 出现下载文件内容乱码损坏的解决方法(推荐)
2016/11/16 PHP
用javascript编写的第一人称射击游戏
2007/02/25 Javascript
网页下载文件期间如何防止用户对网页进行其他操作
2014/06/27 Javascript
JavaScript获取一个范围内日期的方法
2015/04/24 Javascript
javascript中判断json的方法总结
2015/08/27 Javascript
解决node.js安装包失败的几种方法
2016/09/02 Javascript
javascript作用域链与执行环境详解
2017/03/25 Javascript
Angular.JS内置服务$http对数据库的增删改使用教程
2017/05/07 Javascript
Vue.js简易安装和快速入门(第二课)
2017/10/17 Javascript
Django+Vue跨域环境配置详解
2018/07/06 Javascript
浅析Vue.js 中的条件渲染指令
2018/11/19 Javascript
Vue.js子组件向父组件通信的方法实例代码详解
2018/12/10 Javascript
[50:20]DOTA2上海特级锦标赛主赛事日 - 5 总决赛Liquid VS Secret第四局
2016/03/06 DOTA
python二分法实现实例
2013/11/21 Python
python算法学习之基数排序实例
2013/12/18 Python
python回溯法实现数组全排列输出实例分析
2015/03/17 Python
使用python检测主机存活端口及检查存活主机
2015/10/12 Python
取numpy数组的某几行某几列方法
2018/04/03 Python
Python实现检测文件MD5值的方法示例
2018/04/11 Python
Python中dict和set的用法讲解
2019/03/28 Python
使用python telnetlib批量备份交换机配置的方法
2019/07/25 Python
解决Mac下使用python的坑
2019/08/13 Python
Numpy之reshape()使用详解
2019/12/26 Python
HTML5注册页面示例代码
2014/03/27 HTML / CSS
英国领先的男士服装和时尚零售商:Burton
2017/01/09 全球购物
创意广告词
2014/03/17 职场文书
二手房买卖协议书
2014/04/10 职场文书
《小猪家的桃花树》教学反思
2014/04/11 职场文书
中共广东省委常委会党的群众路线教育实践活动整改方案
2014/09/23 职场文书
五年级数学教学反思
2016/02/16 职场文书
python 破解加密zip文件的密码
2021/04/22 Python
Redis IP地址的绑定的实现
2021/05/08 Redis
Consul在linux环境的集群部署
2022/04/08 Servers
Windows Server 2019 安装DHCP服务及相关配置
2022/04/28 Servers