jquery结果显示问题

Question

我想创建一个bmi计算器并尝试以下操作。

$(document).ready(function() { 
// Convert ft to inches 
function convertHeight(ft) { 
    return ft * 12; 
} 

// calculate total height 
function showbmi() { 
    var weight = document.getElementById('weight').value * 1; 
    var height_ft = document.getElementById('height_ft').value * 1; 
    var height_in = document.getElementById('height_in').value * 1; 
    var height = convertHeight(height_ft) + height_in; 
    var female_h = (height * height)/30; 
    var male_h = (height * height)/28; 
    var gender; 
    var x = document.getElementsByName("gender"); 
    for (var i = 0; i < x.length; i++) { 
     if (x[i].checked == true) { 
      gender = x[i].value; 
      break; 
     } 
    } 
    var bmi = "?"; 

    if (gender == "female") { 
     bmi = (Math.round((weight * 703)/(height * height))); 
     if (isNaN(bmi)) bmi = "?"; 
    } else { 
     bmi = (Math.round((weight * 703)/(height * height))); 
     if (isNaN(bmi)) bmi = "?"; 
    } 

    var bmi_msg = "?"; 
    if (bmi < 15) { 

     bmi_msg = "Very severely underweight"; 

    } else if (bmi <= 16) { 
     bmi_msg = "Severely underweight"; 

    } else if (bmi <= 18.4) { 

     bmi_msg = "Underweight"; 

    } else if (bmi <= 24.9) { 
     bmi_msg = "Normal"; 

    } else if (bmi <= 29.9) { 
     bmi_msg = "Overweight"; 

    } else if (bmi <= 34.9) { 
     bmi_msg = "Obese Class I (Moderately obese)"; 

    } else if (bmi <= 39.9) { 
     bmi_msg = "Obese Class II (Severely obese)"; 

    } else { 
     bmi_msg = "Obese Class III (Very severely obese)"; 

    } 
    $("#result").text(bmi); 
    return bmi; 
    $("#comment").text(bmi_msg); 
    return bmi_msg; 

} 
//bmi infos 


//finish 
$("form#calc input").bind("keydown", function() { 
    setTimeout(function() { 
     showbmi(); 
    }, 100); 
    return true; 
}); 
$("form#calc input").bind("change", function() { 
    showbmi(); 
}); 
$("form#calc radio").bind("change", function() { 
    showbmi(); 
}); 
$("form#calc").bind("submit", function() { 
    showbmi(); 
    return false; 
}); 
}); 

bmi显示正确，但消息的forbmi值未显示。我检查了控制台，它说代码无法访问。 有人可以指出我错在哪里，以及我如何改进这些代码。

Answer 1

在设置注释之前设置result内容后，您将返回语句，因此$("#comment").text(bmi_msg);永远不会执行。

只要执行return语句，函数就会将控制权返回给调用者方法，因此执行流中应该只有一个return语句。

所以从代码中删除return bmi;的留言设定工作

$(document).ready(function() { 
 
    // Convert ft to inches 
 
    function convertHeight(ft) { 
 
    return ft * 12; 
 
    } 
 

 
    // calculate total height 
 
    function showbmi() { 
 
     var weight = $('#weight').val() * 1; 
 
     var height_ft = $('#height_ft').val() * 1; 
 
     var height_in = $('#height_in').val() * 1; 
 
     var height = convertHeight(height_ft) + height_in; 
 
     var female_h = (height * height)/30; 
 
     var male_h = (height * height)/28; 
 
     var gender = $('input[name="gender"]:checked').val(); 
 
     var bmi = "?"; 
 

 
     if (gender == "female") { 
 
     bmi = (Math.round((weight * 703)/(height * height))); 
 
     if (isNaN(bmi)) bmi = "?"; 
 
     } else { 
 
     bmi = (Math.round((weight * 703)/(height * height))); 
 
     if (isNaN(bmi)) bmi = "?"; 
 
     } 
 

 
     var bmi_msg = "?"; 
 
     if (bmi < 15) { 
 

 
     bmi_msg = "Very severely underweight"; 
 

 
     } else if (bmi <= 16) { 
 
     bmi_msg = "Severely underweight"; 
 

 
     } else if (bmi <= 18.4) { 
 

 
     bmi_msg = "Underweight"; 
 

 
     } else if (bmi <= 24.9) { 
 
     bmi_msg = "Normal"; 
 

 
     } else if (bmi <= 29.9) { 
 
     bmi_msg = "Overweight"; 
 

 
     } else if (bmi <= 34.9) { 
 
     bmi_msg = "Obese Class I (Moderately obese)"; 
 

 
     } else if (bmi <= 39.9) { 
 
     bmi_msg = "Obese Class II (Severely obese)"; 
 

 
     } else { 
 
     bmi_msg = "Obese Class III (Very severely obese)"; 
 

 
     } 
 
     $("#result").text(bmi); 
 
     $("#comment").text(bmi_msg); 
 
     return bmi; 
 

 
    } 
 
    //bmi infos 
 

 

 
    var timer; 
 
    $("#calc input").bind("keydown change", function() { 
 
    clearTimeout(timer); 
 
    timer = setTimeout(function() { 
 
     showbmi(); 
 
    }, 100); 
 
    return true; 
 
    }); 
 
    $("#calc").bind("submit", function() { 
 
    clearTimeout(timer); 
 
    showbmi(); 
 
    return false; 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<form id="calc"> 
 
    <input id="weight" /> 
 
    <input id="height_ft" /> 
 
    <input id="height_in" /> 
 
    <br /> 
 
    <input name="gender" type="radio" value="male" /> 
 
    <input name="gender" type="radio" value="female" /> 
 
    <br /> 
 
    <input type="submit" value="Check" /> 
 
    <div id="result"></div> 
 
    <div id="comment"></div> 
 
</form>

注：由于您使用jQuery，为什么不使用它的实用方法来获取/设置值/内容