HTML+JS使用正则表达式让input文本框只能输入整数

知道91 | 问题 | 2016-01-14 | 阅读:7159

在制作前台网页的时候我们总是想让文本框只能输入整数,效果就是我们输入非数字的字符时自动去掉非法字符。我喜欢使用jQuery,所以这里展示jQuery的做法。

//只能输入整数
$('.int-num').each(function (e) {
	var obj = this;
	$(this).keyup(function (e) {
		var val=$(obj).val();
		if (val) {
			var pattern = /^-?\d+$/;
			if (!pattern.test(val)) {
				if(val.length == 1 && val=='-') {
					return;
				} else {
					var firstChar = val.substr(0, 1);
					obj.value = val.replace(/\D/g, '')
					if (firstChar == '-')
						obj.value = '-' + obj.value;
				}
			}
		}
	});

	$(this).blur(function (e) {
		var val = $(obj).val();
		var pattern = /^-?\d+$/;
		if (!pattern.test(val)) {
			$(this).val('');
		}
	});
});

html代码如下所示


所以只要输入的不是整数的字符都会被相应的正则表达式规则去掉。