【问题标题】:jquery number spinner not working with float numbersjQuery数字微调器不适用于浮点数
【发布时间】:2021-09-23 09:13:05
【问题描述】:

我有这个 JQUERY 不错的数字微调器,但是当我一次写入 0.01 位时,它并没有进入浮点数。 这是代码: jquery 在头脑中:

 <link rel="stylesheet" href="js/jquery.nice-number.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
   
  <script src="js/jquery.nice-number.js"></script>

输入和漂亮的数字脚本:

<input type="number" value="1.0" name="qty" step="0.1" max="99999" min="0.1">
    <script>

        $(function () {

            $('input[type="number"]').niceNumber();

        });

    </script>

我该如何解决? 谢谢

【问题讨论】:

  • 您有jquery.nice-number.js 的来源吗?最好是工作 CDN。它与您的问题相关还是没有它也一样? (编辑:没有它似乎工作正常)

标签: javascript html jquery numbers


【解决方案1】:

假设这是来自:https://github.com/joshua-s/jquery.nice-number

快速浏览源代码显示:

var newValue = currentValue + 1;

所以 nice-number 插件是硬编码只加/减+1/-1

它确实提供了一个回调,因此您可以编辑该值,但编辑 nice-number.js 以通过设置传递增量步骤可能会更好。

$(function() {

  $('input[type="number"]').niceNumber({
    onDecrement: ($el, newValue, settings) => {
      $el.val(Math.round((newValue + 0.9) * 100) / 100);
      console.log($el.val())
    },
    onIncrement: ($el, newValue, settings) => {
      //console.log($el.val())
      $el.val(Math.round((newValue - 0.9) * 100) / 100);
      console.log($el.val())
    }
  });

});
<!--<link rel="stylesheet" href="js/jquery.nice-number.css">-->
<link ref="stylesheet" href="https://cdn.jsdelivr.net/npm/jquery.nice-number@2.1.0/dist/jquery.nice-number.css">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

<!--<script src="js/jquery.nice-number.js"></script>-->
<script src="https://cdn.jsdelivr.net/npm/jquery.nice-number@2.1.0/dist/jquery.nice-number.js"></script>


<input type="number" value="1.0" name="qty" step="0.1" max="99999" min="0.1" style='width:200px;'>

【讨论】:

  • 有没有一种方法可以同时使用第一种类型,其中步长一次为 1 位数,而第一种类型为 0.1 位数。也许针对特定类的输入?
  • 您可以为每个输入/输入类型组分别调用 .niceNumber。 $(".niceNumberInt").niceNumber(); $(".niceNumber1dp").niceNumber({onIncrement...
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2013-03-22
  • 1970-01-01
  • 2020-02-07
  • 1970-01-01
  • 2018-03-23
相关资源
最近更新 更多