基本上我需要从输入框接受一个简单的十进制值字符串。 输入的长度固定为5位数,因此只允许接受5位数值。
但是如果整数部分的长度是5,它应该能够容纳至少2个以上的小数点,或者至少应该容纳2个十进制数字(不包括小数分隔符)。但是整数部分的长度不应超过5位数。
我认为使用了以下方式:
//co2-weight is the class of input field
//by default the max-length and size is 6
$( '.co2-weight' ).keyup(function() {
if($(this).val().indexOf('.')>1)
{
$('.co2-weight').attr('size','9');
$('.co2-weight').attr('maxlength','9');
}
else
{
$('.co2-weight').attr('size','6');
$('.co2-weight').attr('maxlength','6');
}
});
但是这里需要再次检查整数部分的长度并将其设置为5。 有没有更短或更方便的方式?
更新
基本问题是在答案中缺少的适当情况下动态调整长度。
答案 0 :(得分:1)
这是您使用regular expressions.
的完美案例在您的情况下,这是您需要的正则表达式模式^([0-9]{0,5}(\.[0-9]{0,2}){0,1})$
在javascript中你可以这样使用它:
$(this).val().match(/^([0-9]{0,5}(\.[0-9]{0,2}){0,1})$/)
如果找不到匹配项,则此行单独返回null。匹配数组如果找到匹配项。
如果您需要测试此正则表达式,请使用https://regex101.com/
答案 1 :(得分:1)
您可以使用此代码,但不允许:
它还根据是否有小数点应用属性更改。
它响应WD
事件,因为有些方法可以在没有input
事件触发的情况下更改内容(例如通过上下文菜单,鼠标或其他设备)。
keyup

$( '.co2-weight' ).on('input', function() {
var good = $(this).val()
// remove bad characters and multiple points
.replace(/[^\d.]|\.(?=.*\.)/, '')
// remove any excess of 5 integer digits
.replace(/^(\d{5})\d+/, '$1')
// remove any excess of 2 decimal digits
.replace(/(\.\d\d).+/, '$1');
if (good !== $(this).val()) {
// Only if something had to be fixed, update
$(this).val(good);
}
var pointPos = good.indexOf('.');
// Determine max size depending on presence of point
var size = good.indexOf('.')>1 ? 8 : 6;
// Use prop instead of attr
$('.co2-weight').prop('size',size);
$('.co2-weight').prop('maxlength',size);
});

答案 2 :(得分:0)
使用RegExp,您可以验证输入的格式,如下例...
// regular expression to allow 12345.12
var regExp = new RegExp(/^\d{1,5}\.?\d{0,2}$/);
// initialize form elements
$('.valid').hide();
$('.invalid').hide();
$('.submit').prop('disabled', true);
$('.co2-weight').keyup(function() {
// on keyup validate against regular expression
if (regExp.test($(this).val())) {
$('.valid').show();
$('.invalid').hide();
$('.submit').prop('disabled', false);
} else {
$('.valid').hide();
$('.invalid').show();
$('.submit').prop('disabled', true);
}
});
$('.form').submit(function() {
// alert to show input was valid
alert('submitted');
});

.valid {
color: green;
}
.invalid {
color: red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Type something in the input to see if submit button become enable</p>
<form class="form">
<input type="text" class="co2-weight">
<input type="submit" class="submit">
</form>
<p class="valid">Input format is valid</p>
<p class="invalid">Input format must be <= 99999.99</p>
&#13;