一、代码

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>jQuery实时校验输入框:整数、浮点数</title>
    <style>
    </style>
</head>
<body>
<!-- 引入jquery -->
<script src="http://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script>
<div class="content">
    数量:<input class="check_number" type="text" name="number"/><br/>
    金额:<input class="check_float" type="text" name="reward"/>
</div>
</body>
<script>
    //整数监听:不能小于1
    $('.content').delegate('input.check_number', 'propertychange input', function(e) {
        let totalNumber = $(this).val();
        if (totalNumber) {
            let re = /^[0-9]+$/ ;
            if (re.test(totalNumber)){  //是正整数
                totalNumber *= 1; //string转为int
                if (totalNumber == 0) { //如果是0,则设置为1
                    $(this).val(1);
                } else {
                    $(this).val(totalNumber);
                }
            } else {  //不是正整数,设置为空
                $(this).val('');
            }
        }
    });

    //浮点数监听:最多保留两位小数,不能小于0.01
    $('.content').delegate('input.check_float', 'propertychange input', function(e) {
        let value = $(this).val();
        if (value == "00") { //处理 00开头 特殊情况
            value = 0;
        }
        if (isNaN(value)) {
            $(this).val('');
        } else {
            let indexPoint = String(value).indexOf(".") + 1;    //获取小数点的位置
            let length = String(value).length;
            if ((indexPoint != 0) && ((length-indexPoint) > 2)) { //超过2位小数,则只保留2位小数
                $(this).val(parseFloat(value).toFixed(2));
            } else {
                $(this).val(value);
            }
        }
    });
</script>
</html>

二、 效果图

在这里插入图片描述

三、其他

  • 各位请根据自己的需求调整代码