Question

此脚本在Safari中生成预期结果，但不生成Firefox。（这是我用它测试过的唯一两个浏览器。）

以下是相关的HTML：

<form name="inputForm">

    Weight:<input type="number" name="weight"> (lbs) <br>
    Height:<input type="number" name="height"> (inches) <br>
    <hr>
    <input type="button" name="process" value="Calculate" onclick="calcBMI(weight.value, height.value)">
    <hr>
    BMI: <input type="text" readonly name="bmiResult">  

</form>

以下是整个Javascript，它放在HTML的<head>...</head>标记中：

<script>
    var BMIMULTI = 703;

    function calcBMI(weight, height)
    {
        var bmi = (weight * BMIMULTI) / (height * height);
        document.inputForm.bmiResult.value = bmi;
    }
</script>

两个浏览器中的控制台都没有显示错误。我没有链接到CSS或JS的外部文件。

从我自己的调试中，我发现问题在于height.value中的onclick="calcBMI(...)"。 height.value的值作为calcBMI传递给null函数，而weight.value则适当传递。

在Safari中，两个值都成功传递到calcBMI函数。

为什么会这样？而且，为什么它出现在Firefox而不是Safari？我是javascript的新手，谢谢你的帮助。

Answer 1

input元素（事件处理程序中的当前作用域）在某些浏览器中也具有height属性，这将阻止您从外部作用域访问该名称的字段。

将字段作为表单的成员而不是使用全局范围：

calcBMI(this.form.weight.value, this.form.height.value)

Answer 2

尽量避免使用像height这样的常用词作为变量。我之前遇到过类似的问题。我使用“删除”作为函数名称，过去工作正常但在firefox更新后失败。

Javascript代码适用于Safari，但不适用于Firefox。为什么？

2 个答案: