个人中心
gpt4 book ai didi

javascript - 为英尺和英寸添加下拉列表和计算时出现问题？

转载 作者：搜寻专家 更新时间：2023-10-31 08:27:12 26 4
gpt4 key购买 nike

我已经为 BMR 计算器创建了一个代码，它在不添加下拉列表的情况下工作，但是当我添加一个用于英尺和英寸的下拉列表以及其他表格(如 kg、cm block )时，单击计算按钮它不起作用。

请任何人帮助我。

我的代码:

   <!DOCTYPE html><html><head><meta http-equiv="content-type"  content="text/html;charset=utf-8"/><link rel="stylesheet" type="text/css"  href="easyui.css"><link rel="stylesheet" type="text/css" href="demo.css">   <script type="text/javascript" src="jquery.min.js"></script><script  type="text/javascript" src="jquery.easyui.min.js"></script><style   type="text/css">
 .panel-body {
   background-color: #ffffff;
   color: #000000;
  font-size: 17px;
   }
  .tabs-title {
   font-size: 15px;
  }
   </style>

 <div class="easyui-tabs" style="width:450px;height:250px">
   <div id="rechner" style="box-shadow: 2px 2px 5px 2px #444444; padding:15px; margin:10px; width:310px; border-radius:15px; font-family: Verdana,Arial,'sans-serif'; font-size: 11px;">
<p style="margin-top:0;padding-top:0;text-align:center;font-size:12px;font-weight:bold">Calculate your BMR in US metrics</p>
    <table>
        <tr><td>Gender:</td><td>

        <input type="radio" name="sex1" value="male" checked>Male<input type="radio" name="sex1" value="female">Female</td></tr>
        <tr><td>Age:</td><td>
        <input type="text" size="5" name="age1" id="age1" value="0" onBlur=checkPositiveInteger(this) onChange=checkPositiveInteger(this)></td></tr>
        <tr><td>Height:</td><td><input type="text" size="5" name="height1" id="height1" value="0" onBlur=checkNotNegative(this) onChange=checkNotNegative(this)> feet <input type="text" size="5" id="height2" value="0"  onBlur=checkNotNegative(this) onChange=checkNotNegative(this)> inches</td></tr>
        <tr><td>Weight:</td><td><input type="text" size="5" name="weight1" id="weight1" value="0" onBlur=checkPositive(this) onChange=checkPositive(this)> pounds</td></tr>
        <tr><td colspan="2"><a href="#" class="easyui-linkbutton"  onclick="calculate1()"><button type="button">Calculate</button></a></td></tr>
        <tr><td>Your BMR:</td><td><input type="text" size="10" id="bmr1"> calories/day</td></tr>
    </table>
</div>
<div id="rechner" style="box-shadow: 2px 2px 5px 2px #444444; padding:15px; margin:10px;width:310px;border-radius:15px; font-family:Verdana,Arial,'sans-serif';font-size:11px;background: url(http://www.bmi-rechner.net/images/box_bg.png);">
    <p style="margin-top:0;padding-top:0;text-align:center;font-size:12px;font-weight:bold">Calculate your BMR in EU metrics</p>
    <table>
        <tr><td>Gender:</td><td><input type="radio" name="sex" value="male" checked>Male<input type="radio" name="sex" value="female">Female</td></tr>
        <tr><td>Age:</td><td><input type="text" size="5" name="age" id="age" value="0" onBlur=checkPositiveInteger(this) onChange=checkPositiveInteger(this)></td></tr>
        <tr><td>Height:</td><td><input type="text" size="5" name="height" id="height" value="0" onBlur=checkPositive(this) onChange=checkPositive(this)> centimeters</td></tr>
        <tr><td>Weight:</td><td><input type="text" size="5" name="weight" id="weight" value="0" onBlur=checkPositive(this) onChange=checkPositive(this)> kilograms</td></tr>
        <tr><td colspan="2"><a href="#" class="easyui-linkbutton" onclick="calculate()"><button type="button">Calculate</button></a></td></tr>
        <tr><td>Your BMR:</td><td><input type="text" size="10" id="bmr"> calories/day</td></tr>
    </table>
</div>
  </div>
  <script>

 function calculate(){

 var age=document.getElementById("age").value;
var height=document.getElementById("height").value;
var weight=document.getElementById("weight").value;

var sex;
var x=document.getElementsByName("sex");
for(var i=0;i<x.length;i++){
    if(x[i].checked==true){
        sex=x[i].value;
        break;
    }
}
var bmr;
if(sex=="female"){
    //bmr=655+(9.6*weight)+(1.7*height)-(4.7*age);
    bmr=10*weight+6.25*height-5*age-161;
    document.getElementById("bmr").value=round(bmr);
}else if(sex=="male"){
    //bmr=66+(13.7*weight)+(5.0*height)-(6.8*age);
    bmr=10*weight+6.25*height-5*age+5;
    document.getElementById("bmr").value=round(bmr);
}else{
    alert("You must select a sex.");
}
}
 function checkPositive(field){
var number=field.value;
if(isNaN(number)||number.length==0){
    alert("This field must be a number.");
    field.focus();
}else if(number<=0){
    alert("This number must be positive.");
    field.focus();
}else{
 }
 }
function checkPositiveInteger(field){
var number=field.value;
var number1=Math.floor(number);
if(isNaN(number)||number.length==0){
    alert("This field must be a number.");
    field.focus();
}else if(number<=0){
    alert("This number must be positive.");
    field.focus();
}else if(number-number1!=0){
    alert("This number must be a Integer.");
    field.focus();
}else{
}
}
function checkNotNegative(field){
var number=field.value;
if(isNaN(number)||number.length==0){
    alert("This field must be a number.");
    field.focus();
}else if(number<0){
    alert("This number must be positive or 0.");
    field.focus();
}else{
 }
 }
 function calculate1(){
var age=document.getElementById("age1").value;
var feet=document.getElementById("height1").value;
var inches=document.getElementById("height2").value;
var weight=document.getElementById("weight1").value;
weight=weight*0.4535924;
var height=30.48*feet+inches*2.54;
var sex;
var x=document.getElementsByName("sex1");
for(var i=0;i<x.length;i++){
    if(x[i].checked==true){
        sex=x[i].value;
        break;
    }
}
var bmr;
if(sex=="female"){
    //bmr=655+(9.6*weight)+(1.7*height)-(4.7*age);
    bmr=10*weight+6.25*height-5*age-161;
    document.getElementById("bmr1").value=round(bmr);
}else if(sex=="male"){
    //bmr=66+(13.7*weight)+(5.0*height)-(6.8*age);
    bmr=10*weight+6.25*height-5*age+5;
    document.getElementById("bmr1").value=round(bmr);
  }else{
    alert("You must select a sex.");
  }
     }
   function round(x){
return Math.round(x*1000)/1000;
     }
      </script></div></body></html>

我需要得到如下图所示的下拉列表

enter image description here

最佳答案

好的，试试这个:

<tr><td>Height:</td><td><input type="number" size="5" name="height" id="height" value="0" onBlur=checkPositive(this) onChange=checkPositive(this)> centimeters</td></tr>
<tr><td>Weight:</td><td><input type="number" size="5" name="weight" id="weight" value="0" onBlur=checkPositive(this) onChange=checkPositive(this)> kilograms</td></tr>

对我来说，这是有用的。

如果还有更多问题，我可以将 mods 保存在 fiddle 中。
更新
我已经在 fiddle 中 fork 了 mod。

更新
我不知道为什么，但我不能再保存 fiddle 了，所以我在这里写下你必须做的事情，否则的话

if(number!=""||isNaN(number)||number.length==0){
    alert("This field must be a number.");
    field.focus();
}else if(number<=0){
    alert("This number must be positive.");
    field.focus();
}else{

你必须数数!=""。
更新
要取消 onchange 或 onblur 函数，您可以使用单击按钮“计算”并调用相同的函数，将相同的变量传递给它。
更新

function checkPositive(field){
    if (field.value=="")
        return;

把这个写在你所有的方法中。
我已经尝试再次fork fiddle，试试它是否有mods。 http://plnkr.co/edit/YS1KQ5BIILXhHdcaVE6G?p=preview


更新

http://plnkr.co/edit/cVK9V88YafVgD4jbqwHd?p=preview


那是防止负数的 fiddle ，但我认为这个问题现在已经完全回答了:)


更新
http://plnkr.co/edit/L4w29rrFMMtCmWaQWKTw?p=preview
这一定是为了不让数字不低于 0。

关于javascript - 为英尺和英寸添加下拉列表和计算时出现问题？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/32220613/

26 4 0
文章推荐： java - 如何解决此 Log4J 导入错误(也与类路径有关)？
文章推荐： iOS Today 扩展神秘高度
文章推荐： javascript - 重复的 jQuery 标签
文章推荐： html - Div 内容未在打印中显示
搜寻专家
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com