有一个快速的方法来设置HTML文本输入(<input type=text />),只允许数字击键(加上'.')?


当前回答

有一个很好的解决方案。删除前导零,设置自然位和小数点后的最大位数,处理复制粘贴,确保它是一个数值。

this.value = this.value
    .replace(/\b0+/g, '')
    .replace(/[^0-9.]/g, '')
    .replace(/(\..*?)\..*/g, '$1')
    .replace(/([0-9]{0,6}(\.[0-9]{0,2})?).*/g, '$1')

最后替换设置小数点和自然位的长度。只需将标记替换为您喜欢的值。

.replace (/ ([0 - 9] {0, < max_natural >} (\ [0 - 9] {0, < max_decimal >}) ?)。* / g, 1美元)

其他回答

你可以用以下方法替换Shurok函数:

$(".numeric").keypress(function() {
    return (/[0123456789,.]/.test(String.fromCharCode(Event.which) ))
});

这可以立即删除任何坏字符,只允许一个点,是短的,并允许退格等:

$('.numberInput').keyup(function () {
    s=$(this).val();
    if (!/^\d*\.?\d*$/.test(s)) $(this).val(s.substr(0,s.length-1));
});

2个解决方案:

使用表单验证器(例如jQuery验证插件)

在输入字段的onblur事件期间(即当用户离开字段时)执行检查,使用正则表达式:

<script type="text/javascript">
function testField(field) {
    var regExpr = new RegExp("^\d*\.?\d*$");
    if (!regExpr.test(field.value)) {
      // Case of error
      field.value = "";
    }
}

</script>

<input type="text" ... onblur="testField(this);"/>

下面是我喜欢使用的一个很好的简单的解决方案:

function numeric_only (event, input) {
    if ((event.which < 32) || (event.which > 126)) return true; 
    return jQuery.isNumeric ($(input).val () + String.fromCharCode (event.which));
}// numeric_only;

<input type="text" onkeypress="return numeric_only (event, this);" />

解释:

使用“事件。-首先确定它是否是一个可打印字符。如果不是,那么允许它(如删除和退格)。否则,将字符连接到字符串的末尾,并使用jQuery的“isNumeric”函数测试它。这样就避免了测试每个角色的单调乏味,也适用于剪切/粘贴场景。

如果你想变得更可爱,那么你可以创建一个新的HTML输入类型。让我们称它为“numeric”,这样你就可以有这样的标签:

<input type="numeric" />

它只允许数字字符。只需添加下面的“文档”。准备好”命令:

$(document).ready (function () {
    $("input[type=numeric]").keypress (function (event) {
        if ((event.which < 32) || (event.which > 126)) return true; 
        return jQuery.isNumeric ($(this).val () + String.fromCharCode (event.which));
    });// numeric.keypress;
});// document.ready;

HTML并不关心你使用的类型名称-如果它不识别它,那么它将默认使用一个文本框,所以你可以这样做。你的编辑可能会抱怨,但这就是问题所在。毫无疑问,清教徒会抓狂,但它很有效,很简单,到目前为止对我来说还很强大。

更新

这里有一个更好的方法:它考虑到文本选择,并使用本地javascript:

verify (event) {
    let value = event.target.value;
    let new_value = `${value.substring (0, event.target.selectionStart)}${event.key}${value.substring (event.target.selectionEnd)}`;
    if ((event.code < 32) || (event.code > 126)) return true;
    if (isNaN (parseInt (new_value))) return false;
    return true;
}// verify;
<input name="amount" type="text" value="Only number in here"/> 

<script>
    $('input[name=amount]').keyup(function(){
        $(this).val($(this).val().replace(/[^\d]/,''));
    });
</script>