利用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 相关文章推荐
一个判断email合法性的函数[非正则]
Dec 09 Javascript
javascript 当前日期加(天、周、月、年)
Aug 09 Javascript
写出更好的JavaScript之undefined篇(上)
Nov 22 Javascript
js的.innerHTML = &quot;&quot;IE9下显示有错误的解决方法
Sep 16 Javascript
javascript向后台传送相同属性的参数即数组参数
Feb 17 Javascript
ES6中如何使用Set和WeakSet
Mar 10 Javascript
javascript self对象使用详解
Oct 18 Javascript
jquery Easyui Datagrid实现批量操作(编辑,删除,添加)
Feb 20 Javascript
js与jQuery实现获取table中的数据并拼成json字符串操作示例
Jul 12 jQuery
Node.js + express实现上传大文件的方法分析【图片、文本文件】
Mar 14 Javascript
基于AngularJS拖拽插件ngDraggable.js实现拖拽排序功能
Apr 02 Javascript
详解vue或uni-app的跨域问题解决方案
Feb 21 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
解析Win7 XAMPP apache无法启动的问题
2013/06/26 PHP
php正则取img标记中任意属性(正则替换去掉或改变图片img标记中的任意属性)
2013/08/13 PHP
Thinkphp中import的几个用法详细介绍
2014/07/02 PHP
php控制文件下载速度的方法
2015/03/24 PHP
php使用Image Magick将PDF文件转换为JPG文件的方法
2015/04/01 PHP
PHP通过串口实现发送短信
2015/07/08 PHP
PHP实现事件机制的方法
2015/07/10 PHP
PHP实现冒泡排序的简单实例
2016/05/26 PHP
利用PHP抓取百度阅读的方法示例
2016/12/18 PHP
JAVASCRIPT keycode总结
2009/02/04 Javascript
对象特征检测法判断浏览器对javascript对象的支持
2009/07/25 Javascript
JavaScript 捕获窗口关闭事件
2009/07/26 Javascript
php上传图片并给图片打上透明水印的代码
2010/06/07 Javascript
取消选中单选框radio的三种方式示例介绍
2013/12/23 Javascript
javascript ajax的5种状态介绍
2014/08/18 Javascript
js监听鼠标事件控制textarea输入字符串的个数
2014/09/29 Javascript
javascript实现全角与半角字符的转换
2015/01/07 Javascript
基于Layer+jQuery的自定义弹框
2020/05/26 Javascript
vue 2.0路由之路由嵌套示例详解
2017/05/08 Javascript
在Vue组件上动态添加和删除属性方法
2018/02/23 Javascript
详解webpack-dev-server使用方法
2018/09/14 Javascript
基于AngularJS拖拽插件ngDraggable.js实现拖拽排序功能
2019/04/02 Javascript
vue如何限制只能输入正负数及小数
2019/07/04 Javascript
vue实现pdf文档在线预览功能
2019/11/26 Javascript
Python实现的监测服务器硬盘使用率脚本分享
2014/11/07 Python
Flask入门教程实例:搭建一个静态博客
2015/03/27 Python
python爬虫豆瓣网的模拟登录实现
2019/08/21 Python
Python进行特征提取的示例代码
2020/10/15 Python
Matplotlib animation模块实现动态图
2021/02/25 Python
html5生成柱状图(条形图)效果的实例代码
2016/03/25 HTML / CSS
Born鞋子官网:Born Shoes
2017/04/06 全球购物
2015年人事工作总结范文
2015/04/09 职场文书
承诺书模板大全
2015/05/04 职场文书
CSS3新特性详解(五):多列columns column-count和flex布局
2021/04/30 HTML / CSS
Python图片验证码降噪和8邻域降噪
2021/08/30 Python
Win10服务全部禁用了怎么启动?Win10服务全部禁用解决方法
2022/09/23 数码科技