【发布时间】:2015-08-26 18:23:55
【问题描述】:
我为 BMR 计算器创建了一个代码,它可以在不添加下拉列表的情况下工作,但是当我为英尺和英寸以及其他表格(如 kg、cm 块)添加下拉列表时,单击计算按钮它不起作用。
请任何人帮助我。
我的代码:
<!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>
我需要如下图所示的下拉菜单
【问题讨论】:
-
我不知道我是否得到你要找的东西,这个 Plunker 对我来说工作得很好plnkr.co/edit/XVOmR6OqI3BG96MsC6ht
-
我附上了图片。请以这种方式检查我需要的内容。
-
很难帮助你,因为你有一个工作的例子,如果你发布不工作的东西会更好。但是你有没有看到你是否在“身高”和“体重”的不同字段中输入了相同的名称?发布带有错误的小提琴
-
就像我得到的小提琴一样。请检查所附图像的高度,它有一个上下键,我尝试过这种方式,但它不起作用。请建议我。
标签: javascript html