jQuery实现数字输入补两位小数在Firefox中失效的问题求助

我来帮你搞定这个跨浏览器的小问题～首先得搞清楚为啥Chrome正常但Firefox不行：Firefox对<input type="number">的数值显示有自己的处理逻辑——当你把0.1格式化为0.10并设置回输入框时，它会自动把字符串"0.10"解析成浮点数0.1，所以显示出来还是0.1；另外change事件在Firefox中的触发时机和处理逻辑也和Chrome有差异，可能导致代码没生效。

给你两个可行的解决方案：

方案一：改用text类型输入框（推荐，完全控制显示格式） #

如果不需要依赖number类型的原生步进功能，改用text类型可以彻底解决浏览器兼容性问题，同时还能自己控制输入验证：

HTML代码 #

<input type="text" name="minsum" id="mins strains_month之绑定 repeated parent google<都看 Intermediate><.play operating="minsum" id="minsuminput" placeholder="Betrag" class="form-control numberchange">

JavaScript代码 #

// 监听输入和失去焦点事件，确保格式正确
$(".numberchange").on('blur input', function() {
  let val = $(this).val().trim();
  // 验证输入是否为有效数字
  if (!isNaN(val) && val !== '') {
    let num = parseFloat(val);
    $(this).val(num.toFixed(2));
  }
});

// 阻止输入非数字和多余的小数点
$(".numberchange").keypress(function(e) {
  let charCode = e.which || e.keyCode;
  // 允许数字和小数点
  if (charCode !== 46 && charCode > 31 && (charCode < 48 || charCode > 57)) {
    return false;
  }
  // 确保只能输入一个小数点
  if (charCode === 46 && $(this).val().indexOf('.') !== -1) {
    return false;
  }
});

方案二：保留number类型，调整事件监听逻辑 #

如果一定要用number类型，可以试试监听blur事件（比change事件更可靠），同时强制设置格式化后的字符串：

$(".numberchange").on('blur', function() {
  let val = $(this).val();
  if (val !== '') {
    let num = parseFloat(val);
    let formattedVal = num.toFixed(2);
    $(this).val(formattedVal);
    // 强制触发change事件确保后续逻辑生效
    $(this).trigger('change');
  }
});

不过要注意：即使这样设置，Firefox可能还是会把0.10显示成0.1，因为它会自动格式化number输入框的数值显示——这是浏览器的原生行为，没法完全控制，所以更推荐方案一。

内容的提问来源于stack exchange，提问作者Pla558