今天做项目刚好遇到对input进行校验的问题,就在网上搜索研究了一下,发现目前多数的校验方法都不行或者是不全面,就试着自己写了一个,刚开始选择直接用正则表达式,发现还是高估自己了(’_’),世上无难事只要肯放弃,目前对正则表达式还处于学习阶段,所以最后还是老老实实的写监听事件吧!
代码如下:
<input id="location_xy_y" type="text" autocomplete="off" placeholder="请输入内容" data-min="-90"
data-max="90" class="ol-input__inner">
<script>
$('input').keyup(function () {
$(this).val($(this).val().replace(/[^\d\.-]/g, ''));//只能输入数字、小数点、负号
$(this).val($(this).val().replace(/\.{2,}/g, '.').replace('.', '$#$').replace(/\./g, '').replace('$#$', '.'));//只能有一个小数点
$(this).val($(this).val().replace(/\-{2,}/g, '-').replace('-', '$#$').replace(/\-/g, '').replace('$#$', '-').replace(/(?<=\d)-$|(?<=\.)-$/g, ''));//只能有一个负号,且不出现在输入值中间
var min = $(this).data('min');//最小值,超过则赋值为空
var max = $(this).data('max');
var reg = /^-{1}\d*.?\d*|^-{0}\d+.?\d*/;
if (!reg.test($(this).val())) {
if ($(this).val() != '' || $(this).val() == '-.') {
alert('请输入数字');
$(this).val('');
}
return;
}
else if ((/(?<=-)\./).test($(this).val())) {
$(this).val('');
}
if ($(this).val() != '-' && $(this).val() != '.' && ($(this).val() > max || $(this).val() < min)) {
alert('输入值范围' + min + '-' + max);
$(this).val('');
return;
}
});
$('input').mouseout(function () {
$(this).val($(this).val().replace(/\.$/g, ''));//移出input如果最后一个字符为.,则去除
});
</script>