文本框仅可接收decimal

最新推荐文章于 2021-06-26 16:55:53 发布

转载最新推荐文章于 2021-06-26 16:55:53 发布 · 167 阅读

本文介绍如何使用jQuery控制HTML文本框仅接收特定类型的输入，包括数字及小数，并提供了实现整数输入限制的具体代码示例。

文本框html如下：

<div><label class="label">价格:</label><input id="TextPrice" type="text" name="Price" /></div>

Source Code

jQuery:

 $("#TextPrice").on("input", function (evt) {
            var self = $(this);
            self.val(self.val().replace(/[^0-9\.]/g, ''));
            if ((evt.which != 46 || self.val().indexOf('.') != -1) && (evt.which < 48 || evt.which > 57)) {
                evt.preventDefault();
            }
        });

View Code

如果此文本框只接受整数呢，可以把jQuery稍修改一下：

$("#TextPrice").on("input", function (evt) {
            var self = $(this);
            self.val(self.val().replace(/[^\d].+/, ""));
            if ((evt.which < 48 || evt.which > 57)) {
                evt.preventDefault();
            }
        });

Source Code

结果：