利用Javascript实现BMI计算器


Posted in Javascript onAugust 16, 2016

前言

BMI指数(英文为Body Mass Index),是目前国际上常用的衡量人体胖瘦程度以及是否健康的一个标准,当我们需要比较及分析一个人的体重对于不同高度的人所带来的健康影响时,BMI值是一个中立而可靠的指标。本文将介绍如何用JavaScript实现这个计算器,下面一起看看。

话不多说,直接上代码

<!DOCTYPE html>
<html>
<head lang="en">
  <meta charset="UTF-8">
  <title>BMI计算器</title>
</head>
<head>
<script>
  var BMI={};
 BMI.getBMI=function(a,b){
    var bmi=b/((a/100)*(a/100));
    return bmi;
  };
  BMI.idealweight=function(a){
    var x=(a-100)*0.9;
    return x;
  };
  function Cal(form){
    var a=eval(form.height.value);
    var b=eval(form.weight.value);
    var bmi=eval(form.BMI.value);
    var bmiValue =BMI.getBMI(a,b);
    BMI.disp_alert(bmiValue );
    form.IW.value=BMI.idealweight(a);
    form.BMI.value= bmiValue ;
  }
  BMI.disp_alert = function(bmi){
    if (bmi < 18.5)
    {
      alert("你的体重太轻,要多吃点哟!");
    }
    else if (bmi >= 18.5 && bmi < 25)
    {
      alert("亲,你的体重正常,要继续保持哟!");
    }
    else if (bmi >= 25 && bmi< 30)
    {
      alert("亲,您的体重过重,要减肥了!");
    }
    else
    {
      alert("亲,你确实要减肥了!");
    }
  }
</script>
</head>
<body>
<form method=post>
你的身高(cm):<input type="text" name="height"><br>
  <br/>
你的体重(kg):<input type="text" name="weight"><br>
  <br/>
<input type="button" value="开始计算" onclick="Cal(this.form)">
  <br/>
  <br/>
  你的理想体重:<input type="text" name="IW"><br/>
  <br/>
  您的BMI:<input type="text" name="BMI">
</form>
</body>
</html>

总结

以上就是用Javascript实现BMI计算器的全部内容,很简单吧,感兴趣的朋友可以自己动手实践起来哦,希望对大家使用JavaScript能有所帮助。

Javascript 相关文章推荐
基于jquery的合并table相同单元格的插件(精简版)
Apr 05 Javascript
如何实现修改密码时密码框显示保存到cookie的密码
Dec 10 Javascript
node.js中的fs.writeFile方法使用说明
Dec 14 Javascript
JQuery动态添加Select的Option元素实现方法
Aug 29 Javascript
javascript 动态样式添加的简单实现
Oct 11 Javascript
自定义类似于jQuery UI Selectable 的Vue指令v-selectable
Aug 23 jQuery
JavaScript实现换肤功能
Sep 15 Javascript
js循环map 获取所有的key和value的实现代码(json)
May 09 Javascript
vue最简单的前后端交互示例详解
Oct 11 Javascript
js实现通过开始结束控制的计时器
Feb 25 Javascript
微信小程序实现授权登录
May 15 Javascript
学习 Vue.js 遇到的那些坑
Feb 02 Vue.js
jQuery弹出下拉列表插件(实现kindeditor的@功能)
Aug 16 #Javascript
javascript验证手机号和实现星号(*)代替实例
Aug 16 #Javascript
解决wx.onMenuShareTimeline出现的问题
Aug 16 #Javascript
JavaScript里 ==与===区别详解
Aug 16 #Javascript
DOM中事件处理概览与原理的全面解析
Aug 16 #Javascript
总结javascript中的六种迭代器
Aug 16 #Javascript
你知道setTimeout是如何运行的吗?
Aug 16 #Javascript
You might like
php+javascript的日历控件
2009/11/19 PHP
PHP下编码转换函数mb_convert_encoding与iconv的使用说明
2009/12/16 PHP
php中常用的预定义变量小结
2012/05/09 PHP
php array的学习笔记
2012/05/10 PHP
php中的Base62类(适用于数值转字符串)
2013/08/12 PHP
PHP中对数组的一些常用的增、删、插操作函数总结
2015/11/27 PHP
PHP实现文件上传与下载实例与总结
2016/03/13 PHP
在javascript将NodeList作为Array数组处理的方法
2010/07/09 Javascript
基于Jquery 解决Ajax请求的页面 浏览器后退前进功能,页面刷新功能实效问题
2010/12/11 Javascript
js DOM 元素ID就是全局变量
2012/09/20 Javascript
JS获取页面input控件中所有text控件并追加样式属性
2013/02/25 Javascript
JS字符串处理实例代码
2013/08/05 Javascript
js怎么判断flash swf文件是否加载完毕
2014/08/14 Javascript
JavaScript设计模式之抽象工厂模式介绍
2014/12/28 Javascript
jQuery实现点击小图片淡入淡出显示大图片特效
2015/09/09 Javascript
浅谈node.js中async异步编程
2015/10/22 Javascript
AngularJS控制器之间的通信方式详解
2016/11/03 Javascript
利用imgareaselect辅助后台实现图片上传裁剪
2017/03/02 Javascript
利用n工具轻松管理Node.js的版本
2017/04/21 Javascript
jquery获取file表单选择文件的路径、名字、大小、类型
2019/01/18 jQuery
基于p5.js 2D图像接口的扩展(交互实现)
2020/11/30 Javascript
如何在vue 中使用柱状图 并自修改配置
2021/01/21 Vue.js
python生成器generator用法实例分析
2015/06/04 Python
Python网络编程中urllib2模块的用法总结
2016/07/12 Python
详解python-图像处理(映射变换)
2019/03/22 Python
python算法与数据结构之单链表的实现代码
2019/06/27 Python
在python中做正态性检验示例
2019/12/09 Python
Python读取YAML文件过程详解
2019/12/30 Python
Pygame的程序开始示例代码
2020/05/07 Python
基于Python+QT的gui程序开发实现
2020/07/03 Python
Rentalcars.com中国:世界上最大的在线汽车租赁服务
2019/08/22 全球购物
公司周年庆典标语
2014/10/07 职场文书
建筑横幅标语
2014/10/09 职场文书
培根随笔读书笔记
2015/07/01 职场文书
深入理解go slice结构
2021/09/15 Golang
Python制作表白爱心合集
2022/01/22 Python