Question

我有一个可以向上舍入到最接近的.25的字段。这在Chrome中工作正常，但由于某种原因，它不允许我在IE或Firefox中输入说2.25。它忽略了我正在输入一个点。我有什么明显的遗失吗？

编辑我注意到的一件事是，如果我将keyup更改为模糊，它将正常工作。我需要这个才能在keyup上运行。它本身也会接受.25但不是十进制数。例如2.25。

＆＃13;

$(document).on('keyup', '.Monday', findTotalMon);

function findTotalMon() {

  var arr = document.getElementsByClassName('Monday');

  var tot = 0;

  for (var i = 0; i < arr.length; i++) {
    if (parseFloat(arr[i].value)) {
        var newValue;
        newValue = (.25 * Math.round(4 * arr[i].value));
        arr[i].value = newValue;
        tot += parseFloat(newValue);
        
    }
  }

  document.getElementById('totalHoursMon').value = tot;
  if (tot === 0) {
    document.getElementById('totalHoursMon').value = '';
  }
 
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
   <input class="form-control full-width Monday" name="monday" id="monday" type="number" step="any" /><br><br>
    <input class="form-control full-width totalBox" name="total" id="totalHoursMon" type="text" readonly="readonly"/>

＆＃13;

Answer 1

问题在于使用keyup和使用新解析/舍入的float覆盖你的字段值。

输入小数点分隔符后，输入将被解析并舍入，分隔符将消失，因为“1”或“1”被解析为1.

解决此问题的一种方法是仅在圆形输入与原始输入不同时覆盖您的字段。

$(document).on('keyup', '.Monday', findTotalMon);

function findTotalMon() {

  var arr = document.getElementsByClassName('Monday');
  var originalValue, newValue, tot = 0;

  for (var i = 0; i < arr.length; i++) {
    originalValue = arr[i].value;
    if (parseFloat(originalValue)) {
        newValue = (.25 * Math.round(4 * arr[i].value));
        
        tot += parseFloat(newValue);
        if (newValue != originalValue) {
            // we're only overwriting input when the rounded value is different than the original
            arr[i].value = newValue;
        }
    }
  }

  document.getElementById('totalHoursMon').value = tot;
  if (tot === 0) {
    document.getElementById('totalHoursMon').value = '';
  }
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
   <input class="form-control full-width Monday" name="monday" id="monday" type="number" step="any" /><br><br>
    <input class="form-control full-width totalBox" name="total" id="totalHoursMon" type="text" readonly="readonly"/>

旁注：

使用keyup并覆盖用户的输入真的很烦人。例如，在测试时，我意识到你不能使用退格键来纠正你的输入。我知道你说你必须使用keyup，但我强烈建议你使用blur或keypress。为了您的用户：）

parseFloat在chrome中工作但不是IE或Firefox

1 个答案: