Question

好的，这就是代码。

HTML：

      <input id="cel" onkeyup="conversion('celsius')"> degrees Celsius<br>
  equals<br>
  <input id="far" onkeyup="convert('farenheit')"> degrees Fahrenheit<br>

这是通过“src”属性链接到html页面的Javascript：

var celsius = document.getElementById('cel').value;
var farenheit = document.getElementById('far').value;


function conversion(celsius, farenheit){
  if (celsius == true){
    var cels2far = celsius * 1.8 + 32;
    return cels2far
  } if (farenheit == true) {
    var far2cels = (farenheit - 32) * 5/9;
    return far2cels
  }
};

我想让它在用户将其输入文本字段后立即转换。我去了几次并做了一些改动，但我不知道为什么它不起作用。

任何帮助都将不胜感激。

Answer 1

你的函数转换需要两个参数，你似乎期望它们都是布尔值。但是你用一个参数调用它，它总是一个字符串。

您也可以通过重复使用这些名称来覆盖全局变量'celsius'和'farenheit'（即您在函数之外定义的那些变量）。

此外，因为您检索函数外部的单元格的值，它们只会在页面首次加载时设置，然后再也不会更新;每次调用转换函数时都需要重新检索单元格值。

此外，当您检索任何HTML元素的“value”属性时，它将始终是一个字符串，因此您必须将其转换为数字数据类型（我的示例代码使用'parseFloat'函数）

当您真正需要将结果放回HTML时，您的函数也只是返回转换结果。

试试这个：

function conversion(tempType){
  var celsius = parseFloat(document.getElementById('cel').value);
  var farenheit = parseFloat(document.getElementById('far').value);

  if (tempType == 'celsius'){
    var cels2far = celsius * 1.8 + 32;
    document.getElementById('far').value = cels2far;
  }
  if (tempType == 'farenheit') {
    var far2cels = (farenheit - 32) * 5/9;
    document.getElementById('cel').value = far2cels;
  }
}

这是很多变化，但不要过于消极！学习代码是很多试验和错误。：）

Answer 2

尝试使用addEventListener代替j best practice的onkeyup=""属性。

此外，您可以验证用户仅输入数字，但此时我认为不需要。

var celsius = document.getElementById('cel');
var farenheit = document.getElementById('far');

celsius.addEventListener("keyup", function() {
  if(!isNaN(this.value)) //<-- only numbers
    farenheit.value = (this.value * 1.8) + 32;
});

farenheit.addEventListener("keyup", function() {
  if(!isNaN(this.value))
   celsius.value = (this.value - 32) * 5/9
});

<input id="cel"> degrees Celsius<br>
equals<br>
<input id="far"> degrees Fahrenheit<br>

但如果您仍想使用您的代码，则需要进行一些调整，这里有效：

var celsius = document.getElementById('cel');
var farenheit = document.getElementById('far');

function conversion(tofarenheit){
  if (tofarenheit) {
    farenheit.value = celsius.value * 1.8 + 32;
  } else {
    celsius.value = (farenheit.value - 32) * 5/9;
  }
};

<input id="cel" onkeyup="conversion(true)"> degrees Celsius<br>
equals<br>
<input id="far" onkeyup="conversion()"> degrees Fahrenheit<br>

Answer 3

你必须得到你的函数中的字段值，否则它总是为null或你拥有的默认值

function conversion(kind){
  if (kind == 'celsius'){
    var cels2far = parseFloat(document.getElementById('cel').value) * 1.8 + 32;
    return cels2far
  } if (kind == 'farenheit') {
    var far2cels = (parseFloat(document.getElementById('far').value) - 32) * 5/9;
    return far2cels
  }
};

此外，当您将字符串作为函数的第一个参数传递时，将始终设置摄氏度并且永远不会设置farenheit。所以也要改变它。

在javascript中使用计算时，请始终确保parseFloat或parseInt。

Answer 4

参数设置错误。该函数应该只接受一个参数，因此看起来像function conversion(type)，然后条件看起来像if(type === 'celsius')而另一个看起来像else if(type === 'farenheit')

创建了我自己的Farenheit-to-Celsius转换器。为什么它不起作用？

4 个答案: