利用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+HttpHandler实现图片裁剪效果代码(适用于论坛, SNS)
Sep 02 Javascript
javascript 基础篇4 window对象,DOM
Mar 14 Javascript
js计算两个时间之间天数差的实例代码
Nov 19 Javascript
JavaScript中如何通过arguments对象实现对象的重载
May 12 Javascript
JavaScript制作简单的日历效果
Mar 10 Javascript
自己动手制作基于jQuery的Web页面加载进度条插件
Jun 03 Javascript
js实现表单及时验证功能 用户信息立即验证
Sep 13 Javascript
jQuery 插件封装的方法
Nov 16 Javascript
vue.js之vue-cli脚手架的搭建详解
May 05 Javascript
详解Vue整合axios的实例代码
Jun 21 Javascript
jquery动态添加以及遍历option并获取特定样式名称的option方法
Jan 29 jQuery
页面内锚点定位及跳转方法总结(推荐)
Apr 24 Javascript
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读取30天之内的根据算法排序的代码
2008/04/06 PHP
PHP通用检测函数集合
2011/02/08 PHP
php获取用户浏览器版本的方法
2015/01/03 PHP
php实现查询功能(数据访问)
2017/05/23 PHP
理解Javascript_03_javascript全局观
2010/10/11 Javascript
jquery连缀语法如何实现
2012/11/29 Javascript
JQuery跳出each循环的方法
2015/04/16 Javascript
学习JavaScript事件流和事件处理程序
2016/01/25 Javascript
浅谈html转义及防止javascript注入攻击的方法
2016/12/04 Javascript
JS实现数组去重复值的方法示例
2017/02/18 Javascript
Angular2 父子组件数据通信实例
2017/06/22 Javascript
微信小程序学习之数据处理详解
2017/07/05 Javascript
vue-cli+webpack项目 修改项目名称的方法
2018/02/28 Javascript
修改vue+webpack run build的路径方法
2018/09/01 Javascript
详解为生产环境编译Angular2应用的方法
2018/12/10 Javascript
解决layui-table单元格设置为百分比在ie8下不能自适应的问题
2019/09/28 Javascript
Python 常用的安装Module方式汇总
2017/05/06 Python
Python+matplotlib实现填充螺旋实例
2018/01/15 Python
Python中函数的基本定义与调用及内置函数详解
2019/05/13 Python
python ffmpeg任意提取视频帧的方法
2020/02/21 Python
Python3操作YAML文件格式方法解析
2020/04/10 Python
Django数据结果集序列化并展示实现过程
2020/04/22 Python
Pycharm学生免费专业版安装教程的方法步骤
2020/09/24 Python
2014年圣诞节倒计时网页的制作过程
2014/12/05 HTML / CSS
美国一家主营日韩美妆护肤品的在线商店:iMomoko
2016/09/11 全球购物
美国一家著名的儿童鞋制造商:Stride Rite
2017/01/02 全球购物
澳大利亚礼品篮网站:Macarthur Baskets
2019/10/14 全球购物
Zatchels官网:英国剑桥包品牌
2021/01/12 全球购物
护理专业推荐信
2013/11/07 职场文书
教师校本培训方案
2014/02/26 职场文书
马丁路德金演讲稿
2014/05/19 职场文书
室内设计专业自荐信
2014/05/31 职场文书
公安忠诚教育心得体会
2016/01/23 职场文书
导游词之北京明十三陵
2019/10/28 职场文书
CSS预处理框架——Stylus
2021/04/21 HTML / CSS
新手必备Python开发环境搭建教程
2021/05/28 Python