文本框只能输入正整数和小数并且保留两位小数

最新推荐文章于 2022-08-04 11:24:35 发布

IT界的渣

最新推荐文章于 2022-08-04 11:24:35 发布

阅读量882

点赞数

CC 4.0 BY-SA版权

文章标签： js javascript Java

本文链接：https://blog.csdn.net/qq_34523482/article/details/116897967

本文介绍了三种实现HTML输入框只允许输入正整数和最多两位小数的方法。方式一利用HTML5的`<input type=number>`属性，方式二使用jQuery监听keyup事件，方式三通过JavaScript函数实现验证并处理输入值。这些方法都能有效限制用户输入格式，确保数据的准确性和一致性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

方式一

<input  type="number" step="0.01"  min="0" onkeyup="this.value= this.value.match(/\d+(\.\d{0,2})?/) ? this.value.match(/\d+(\.\d{0,2})?/)[0] : ''">

方式二

   
        $(".justDouble").keyup(function(){
            let value = $(this).val();
            $(this).val(this.value= this.value.match(/\d+(\.\d{0,2})?/) ? this.value.match(/\d+(\.\d{0,2})?/)[0] : '');
        })

方式三

		// 此方法可以进行验证只能输入正整数和小数并且是两位小数点并且可以解决输入000000
		function changeNumValue(tmpVal){
			if (tmpVal) {
				var tmpVal = tmpVal.replace(/[^\d\.]/g, '');
				var reg = /^(0|([1-9]\d*))(\.\d{1,2})?$/; //正则验证保留 最多允许后输入两位小数
				if (!reg.test(tmpVal)) {
					//验证第一位是否为0
					if('.' == tmpVal.charAt(0)){
						return 0;
					}
					//验证第一位和第二位是否都是0
					let tempVal = tmpVal.substring(0, 2);
					if(tempVal == '00'){
						return 0;
					}
					tmpVal = tmpVal + "";
					tmpVal = tmpVal.substring(0, tmpVal.indexOf(".") + 3);
					var n = (tmpVal.split('.')).length - 1;
					if (n > 1) {
						tmpVal = tmpVal.substring(0, tmpVal.indexOf("."));
					}

				}
				return tmpVal;
			} else {
				return "";
			}
		}