利用Javascript实现BMI计算器

 更新时间:2016年08月16日 11:58:07   转载 投稿:daisy  
BMI指数计算器相信大家都用过,那用JavaScript怎么实现呢?其实很简单,这篇文章给出了实例代码,有需要的可以参考学习。

前言

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能有所帮助。

相关文章

  • Web纯前端“旭日图”实现元素周期表

    Web纯前端“旭日图”实现元素周期表

    本文主要介绍了Web纯前端“旭日图”实现元素周期表的实例解析。具有很好的参考价值。下面跟着小编一起来看下吧
    2017-03-03
  • Javascript(es2016) import和require用法和区别详解

    Javascript(es2016) import和require用法和区别详解

    本篇文章主要介绍了Javascript(es2016) import和require用法和区别详解,具有一定的参考价值,有兴趣的可以了解下
    2017-08-08
  • JS俄罗斯方块,包含完整的设计理念

    JS俄罗斯方块,包含完整的设计理念

    由于该游戏属于二维游戏,所以布置好网格是写好该游戏的关键,无论是游戏窗口还是预览窗口
    2010-12-12
  • JavaScript静态作用域和动态作用域实例详解

    JavaScript静态作用域和动态作用域实例详解

    这篇文章主要介绍了JavaScript静态作用域和动态作用域的实例代码,本文通过文字实例代码相结合的形式给大家介绍的非常详细,具有一定的参考借鉴价值,需要的朋友可以参考下
    2019-06-06
  • javascript eval函数深入认识

    javascript eval函数深入认识

    发现为本文起一个合适的标题还不是那么容易,呵呵,所以在此先说明下本文的两个目的
    2009-02-02
  • GOJS+VUE实现流程图效果

    GOJS+VUE实现流程图效果

    这篇文章主要为大家详细介绍了GOJS+VUE实现流程图效果,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2018-12-12
  • Javascript中for循环语句的几种写法总结对比

    Javascript中for循环语句的几种写法总结对比

    如果您希望一遍又一遍地运行相同的代码,并且每次的值都不同,那么使用循环是很方便的,javascript中for循环也是非常常用的,下面这篇文章主要介绍了Javascript中for循环的几种写法,需要的朋友可以参考借鉴,一起来看看吧。
    2017-01-01
  • 小程序getLocation需要在app.json中声明permission字段

    小程序getLocation需要在app.json中声明permission字段

    这篇文章主要介绍了小程序getLocation需要在app.json中声明permission字段,个别需要获取用户地理位置的在开发者工具调试时会出现getLocation需要在app.json中声明permission字段 ,下面我们就一起来解决一下
    2019-04-04
  • 浅谈js script标签中的预解析

    浅谈js script标签中的预解析

    本文主要对js中script标签中的预解析进行详细介绍。具有一定的参考价值,下面跟着小编一起来看下吧
    2016-12-12
  • js中的cookie的读写操作示例详解

    js中的cookie的读写操作示例详解

    cookie是有有效期的,cookie的默认有效期是从cookie生成至浏览器关闭,也可以通过设置cookie的有效期来指定其失效日期;用户也可以禁止cookie也可以手动删除cookie
    2014-04-04

最新评论