javascript - 我正在尝试根据遗传学制作身高计算器。但是javascript没有返回预期的答案

Question

我是 javascript 的新手。尝试弄清楚，因为我已经学习了 Java。希望你们帮助我

这是我的表格：

<form>
    Male <input type="radio" id="male" name="selects"/>
    Female <input type="radio" id="female" name="selects"/><br/>
    Mom's height <input type="text" id="moms"/>
    Dad's height <input type="text" id="dads"/>
    <input type="button" value="Go!" onclick="calculate(document.getElementById('dads').value, document.getElementById('moms').value);"/>
</form>

这是我的 Javascript ：

<script type="text/javascript">
    function calculate (d, m) 
    {
        if (document.getElementById('male').checked) 
        {
            var result = (d+m+13)/2;
            document.write(result);
        } 
        else if (document.getElementById('female').checked) 
        {
            var result = (d+m-13)/2;
            document.write(result);
        } 
        else
        {
            alert("Choose a gender!");
        }

    }

</script>

Answer 1

您的输入值是字符串，您需要parseInt()在进行数字运算之前将它们解析为整数（使用）。

工作演示

试试下面的代码：

function calculate (d, m) 
{
    if (document.getElementById('male').checked) 
    {
        var result = (parseInt(d,10)+parseInt(m,10)+13)/2;
        document.write(result);
    } 
    else if (document.getElementById('female').checked) 
    {
        var result = (parseInt(d,10)+parseInt(m,10)-13)/2;
        document.write(result);
    } 
    else
    {
        alert("Choose a gender!");
    }

}

注意：正如其他人已经指出的那样，使用它不是一个好习惯，document.write因为它们会重新绘制整个屏幕。相反，您可以有一个输出 div 并将结果分配给它innerHTML，如下所示。

document.getElementById('output_div').innerHTML = result;