我如何在输入字段中显示结果值？

Question

//这里我想使用javascript将温度从celcius转换为farenheit。当我输入celcius的值时，它会立即计算，我可以使用alert显示结果。但是我想在Farenheit输入字段中显示结果。我可以？

//var celcius = document.getElementById("celcius")
//var farenheit = document.getElementById("farenheit")
function converter() {
  farenheit.value = (celcius.value * 1.8) + 32;

  alert(farenheit.value);
  document.getElementById("farenheit") = farenheit.value;
}

.container {
  width: 500px;
  height: 500px;
  background-color: blue;
  color: white;
  margin: auto;
}

h1 {
  text-align: center;
}

.btn1 {
  text-align: center;
}

.celcius {
  text-align: center;
}

.farenheit {
  text-align: center;
}

<div class="container">
  <form>
    <h1>Temperature Converter</h1>
    <div class="celcius">
      <label>Celcius:</label>
      <input type="number" id="celcius" placeholder="Enter Temperature In Celcius">
    </div>
    <br><br><br>
    <div class="btn1">
      <button onclick="converter()">Converter</button>
    </div>
    <br><br><br>
    <div class="farenheit">
      <label>Farenheit:</label>
      <input type="number" id="farenheit" disabled>
    </div>
  </form>

</div>

Answer 1

你可以用它。

function converter() {
  farenheit.value = (celcius.value * 1.8) + 32;

  alert(farenheit.value);
  $("#farenheit").val(farenheit.value);
}

Answer 2

直接使用farenheit.value。

function converter(event) {

var celcius = document.getElementById("celcius")
var farenheit = document.getElementById("farenheit")
farenheit.value = (celcius.value * 1.8) + 32;

}

.container {
  width: 500px;
  height: 500px;
  background-color: blue;
  color: white;
  margin: auto;
}

h1 {
  text-align: center;
}

.btn1 {
  text-align: center;
}

.celcius {
  text-align: center;
}

.farenheit {
  text-align: center;
}

<div class="container">
  <form>
    <h1>Temperature Converter</h1>
    <div class="celcius">
      <label>Celcius:</label>
      <input type="number" id="celcius" placeholder="Enter Temperature In Celcius">
    </div>
    <br><br><br>
    <div class="btn1">
      <button type="button" onclick="converter()">Converter</button>
    </div>
    <br><br><br>
    <div class="farenheit">
      <label>Farenheit:</label>
      <input type="number" id="farenheit" disabled>
    </div>
  </form>

</div>

Answer 3

根据什么说here你可以使用document.getElementById("farenheit").value

Answer 4

在你的HTML按钮设置type="button"和JS代码应该是

function converter() {

   var farenheit = (document.getElementById("celsius") * 1.8) + 32;

    document.getElementById("farenheit").value = farenheit;

  }

Answer 5

将您的javascript更改为：

//var celcius = document.getElementById("celcius")
//var farenheit = document.getElementById("farenheit")
function converter() {
  farenheit.value = (celcius.value * 1.8) + 32;

  alert(farenheit.value);
  document.getElementById("farenheit").value = farenheit.value;
}