利用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 相关文章推荐
点图片上一页下一页翻页效果
Jul 09 Javascript
Moment.js 不容错过的超棒Javascript日期处理类库
Apr 15 Javascript
浅析JavaScript动画模拟拖拽原理
Dec 09 Javascript
AngularJS中$http使用的简单介绍
Mar 17 Javascript
Angular组件化管理实现方法分析
Mar 17 Javascript
微信小程序上滑加载下拉刷新(onscrollLower)分批加载数据(一)
May 11 Javascript
jQuery+ajax实现局部刷新的两种方法
Jun 08 jQuery
jquery实现限制textarea输入字数的方法
Sep 06 jQuery
vue如何解决循环引用组件报错的问题
Sep 22 Javascript
vue+webpack dev本地调试全局样式引用失效的解决方案
Nov 12 Javascript
在vue中使用jsonp进行跨域请求接口操作
Oct 29 Javascript
Java无向树分析 实现最小高度树
Apr 09 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
海河写的 Discuz论坛帖子调用js的php代码
2007/08/23 PHP
PHP 执行系统外部命令 system() exec() passthru()
2009/08/11 PHP
php在程序中将网页生成word文档并提供下载的代码
2012/10/09 PHP
解析yii数据库的增删查改
2013/06/20 PHP
php+jQuery+Ajax简单实现页面异步刷新
2016/08/08 PHP
PHP空值检测函数与方法汇总
2017/11/19 PHP
php 使用expat方式解析xml文件操作示例
2019/11/26 PHP
Javascript实例教程(19) 使用HoTMetal(3)
2006/12/23 Javascript
jQuery操作select的实例代码
2012/06/14 Javascript
Highcharts 非常实用的Javascript统计图demo示例
2013/07/03 Javascript
JavaScript实现控制打开文件另存为对话框的方法
2015/04/17 Javascript
AngularJS初始化静态模板详解
2016/01/14 Javascript
jQuery Ajax Post 回调函数不执行问题的解决方法
2016/08/15 Javascript
vue多种弹框的弹出形式的示例代码
2017/09/18 Javascript
基于$.ajax()方法从服务器获取json数据的几种方式总结
2018/01/31 Javascript
Vue.js 实现微信公众号菜单编辑器功能(二)
2018/05/08 Javascript
webpack里使用jquery.mCustomScrollbar插件的方法
2018/05/30 jQuery
nodejs的路径问题的解决
2018/06/30 NodeJs
vue中v-for循环给标签属性赋值的方法
2018/10/18 Javascript
微信小程序实现简单购物车功能
2020/12/30 Javascript
[06:36]吞吞映像top1
2014/06/20 DOTA
Python读取MRI并显示为灰度图像实例代码
2018/01/03 Python
10 行 Python 代码教你自动发送短信(不想回复工作邮件妙招)
2018/10/11 Python
完美解决TensorFlow和Keras大数据量内存溢出的问题
2020/07/03 Python
利用python对mysql表做全局模糊搜索并分页实例
2020/07/12 Python
Python使用pyexecjs代码案例解析
2020/07/13 Python
Python字符串及文本模式方法详解
2020/09/10 Python
Fanatics法国官网:美国体育电商
2019/08/27 全球购物
《山谷中的谜底》教学反思
2014/04/26 职场文书
社保缴纳证明申请书
2014/11/03 职场文书
2014年后勤工作总结
2014/11/18 职场文书
中国世界遗产导游词
2015/02/13 职场文书
服务员岗位职责范本
2015/04/09 职场文书
爱心捐赠活动简讯
2015/07/20 职场文书
《乘法分配律》教学反思
2016/02/24 职场文书
Innodb存储引擎中的后台线程详解
2022/04/03 MySQL