1

当我选择 3 的选项时，例如在逗号后按 3 取整。有人能帮我吗？

function LengthConverter(valNum) {
  document.getElementById("outputMeters").innerHTML = (valNum * 1.8) + 32;
}
<p>
  <label>Celsius</label>
  <input autofocus id="inputFeet" type="number" placeholder="Celsius" oninput="LengthConverter(this.value)" onchange="LengthConverter(this.value)">

  <td class="precision">Precision:
    <select name="precision" id="opt" size="1" onchange="update()">
      <option value="1">0</option>
      <option value="10">1</option>
      <option value="100">2</option>
      <option selected="selected" value="1000">3</option>
      <option value="10000">4</option>
      <option value="100000">5</option>
      <option value="1000000">6</option>
      <option value="10000000">7</option>
      <option value="100000000">8</option>
      <option value="1000000000">9</option>
      <option value="1000000000000">12</option>
      <option value="1000000000000000">15</option>
      <option value="1000000000000000000">18</option>
    </select>
  </td>

</p>
<p>Fahrenheit: <span id="outputMeters"></span></p>

4

4 回答 4

1

toFixed()是你的朋友。它还将处理舍入。虽然请注意它返回一个字符串。

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/toFixed

于 2019-10-09T15:19:20.017 回答
0

您的精度选择器正在调用未创建的更新函数，因此您可以摆脱 onchange="update()" 。正如人们所说的使用 toFixed()，下面是如何实现它。

<p>
    <label>Celsius</label>
    <input autofocus id="inputFeet" type="number" placeholder="Celsius" oninput="LengthConverter(this.value)" onchange="LengthConverter(this.value)">
    
   <td class="precision">Precision: <select name="precision" id="opt" size="1">
      <option value="0">0</option>
      <option value="1">1</option>
      <option value="2">2</option>
      <option selected="selected" value="3">3</option>
      <option value="4">4</option>
      <option value="5">5</option>
      <option value="6">6</option>
      <option value="7">7</option> 
      <option value="8">8</option>
      <option value="9">9</option>
      <option value="12">12</option>
      <option value="15">15</option>
      <option value="18">18</option>
  </select></td>
    
  </p>
  <p>Fahrenheit: <span id="outputMeters"></span></p>
  
  <script>
  
  function LengthConverter(valNum) {
   var percision = percision = document.getElementById("opt").value
  	var fahrenheitValue = (valNum*1.8)+32;
    var stringWithPercision = fahrenheitValue.toFixed(percision);
	document.getElementById("outputMeters").innerHTML=stringWithPercision;
    
  }
  </script>

于 2019-10-09T15:46:29.763 回答
0

看到这个辅助函数

function round(x, n) { 
  return parseFloat(Math.round(x * Math.pow(10, n)) / Math.pow(10, n)).toFixed(n);
}

它是 和 的组合Math.round，toFixed()填充零。

<p>
    <label>Celsius</label>
    <input autofocus id="inputFeet" type="number" placeholder="Celsius" oninput="LengthConverter()" onchange="LengthConverter()">
    
   <td class="precision">Precision: <select name="precision" id="opt" size="1"  onchange="LengthConverter()">
      <option value="1">0</option>
      <option value="10">1</option>
      <option value="100">2</option>
      <option selected="selected" value="1000">3</option>
      <option value="10000">4</option>
      <option value="100000">5</option>
      <option value="1000000">6</option>
      <option value="10000000">7</option> 
      <option value="100000000">8</option>
      <option value="1000000000">9</option>
      <option value="1000000000000">12</option>
      <option value="1000000000000000">15</option>
      <option value="1000000000000000000">18</option>
  </select></td>
    
  </p>
  <p>Fahrenheit: <span id="outputMeters"></span></p>
  
  <script>
  function LengthConverter() {
    var inputFeet = document.getElementById("inputFeet").value;
    var opt = document.getElementById("opt").value.length;
    document.getElementById("outputMeters").innerHTML = round((inputFeet * 1.8) + 32, --opt);
  }
  
  function round(x, n) { 
    return parseFloat(Math.round(x * Math.pow(10, n)) / Math.pow(10, n)).toFixed(n);
  }
  </script>

于 2019-10-09T15:22:31.543 回答
0

该toFixed()方法将数字转换为字符串，保留指定的小数位数。

const n = 4.8768;
const res = n.toFixed(2); // res is a string
console.log(res);
console.log(typeof(res));

华氏摄氏度： F = (C x 1.8) + 32

将事件侦听器添加到<input>( keyup) 和<select></select>( change)。

例子

let celsius = document.getElementById("celsius");
let precision = document.getElementById("precision");
let fahrenheit = document.getElementById("fahrenheit");

function celsiusToFahrenheit(val) {
  // F =  (C x 1.8) + 32
  return (val * 1.8) + 32;
}

function getResult(precision, val) {
  return celsiusToFahrenheit(val).toFixed(precision);
}

celsius.addEventListener("keyup", function() {
  let selectedValue = precision.options[precision.selectedIndex].value;
  fahrenheit.innerHTML = getResult(selectedValue, this.value);
})

precision.addEventListener("change", function() {
  let selectedValue = this.options[this.selectedIndex].value;
  if (celsius.value) {
    fahrenheit.innerHTML = getResult(selectedValue, celsius.value);
  }
})
<section>
  <span>Celsius:</span><input id="celsius" type="text"><span>Precision:</span>
  <select name="" id="precision">
    <option value="0" selected>0</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
    <option value="6">6</option>
    <option value="7">7</option>
    <option value="8">8</option>
    <option value="9">9</option>
    <option value="10">10</option>
    <option value="11">11</option>
    <option value="12">12</option>
    <option value="13">13</option>
    <option value="14">14</option>
    <option value="15">15</option>
    <option value="16">16</option>
    <option value="17">17</option>
    <option value="18">18</option>
  </select>
</section>
<section>
  <span>Fahrenheit:</span><span id="fahrenheit"></span>
</section>

于 2019-10-09T16:06:22.960 回答