javascript 中的长度转换器

Question

我必须复制一个像上图一样的长度转换器。当您在框中输入一个数字并按下一个按钮时，它会在您选择的按钮右侧为您提供结果。我从制作按钮开始。这是代码，我的问题是我不知道如何制作一个 returns 框外的函数作为所选按钮的结果。

Valeur:<input type="text" name="valeur" value="0" oninput="LengthConverter(this.value)"onchange="LengthConverter(this.value)"> Resultat ici<br>
<button type="button" id="inchToCm" onclick="pvc()">Pouces vers cm</button>
<button type="button" id="cmtoInch">CM vers pouces</button>
<button type="button"id="celciusToFarenheit">Celcius vers
Farenheit</button>
    <button type="button" id="farenheitToCelcius">Farenheit vers Celcius</button>

我开始制作长度转换函数：

<script>
function pvc(valnum){
    document.getElementById("outputCm").innerHTML=valnum/0.39370;
}

</script>

在此先感谢您的帮助

Answer 1

我为 "Resultat ici" 添加了一个带有 id 的 p 元素，以便可以从用户那里检索该值。

Valeur:<input type="text" id="value" name="valeur" value="0" /> 

<p id="result">Resultat ici</p>

<button type="button" id="inchToCm" onclick="pvc()">Pouces vers cm</button>
<button type="button" id="cmtoInch" onclick="pvc()">CM vers pouces</button>
<button type="button"id="celciusToFarenheit" onclick="pvc()">Celcius vers
Farenheit</button>
<button type="button" id="farenheitToCelcius" onclick="pvc()">Farenheit vers 
Celcius</button>

我在下面的代码中为您做了第一次转换：

<script>
     function pvc() {  
        //get user's input
      var input = document.getElementById("value").value;

     /*implement if statement tests here for the next 3 buttons
      (cmtoinch, celctofahr, fahrtocelc)
      */

      //result of the calculation that is then put into the result p element with the id of result.
      var result = document.getElementById("result");
      result.innerHTML = input / 0.39370;

    }
</script>

此外，这里有一个代码笔示例：https://codepen.io/capozzic1/pen/MmeXxR

更新：codepen 包含 if 语句

javascript 中的长度转换器

length converter in javascript

html

javascript

function

converters