在javascript / jquery中输入掩码

时间:2012-02-17 17:37:49

标签: javascript jquery

表单中有一个文本框,其中只允许特定的数字输入。即

0.5, 1, 1.5, 2, 2.5, 3........ and so on

如何为这些输入屏蔽此文本框?或者我应该使用什么样的正则表达式?

3 个答案:

答案 0 :(得分:1)

如果您只想验证提交,只需使用parseFloatMath.floortoString

function isValidValue(text) {
    return text == (Math.floor(parseFloat(text) * 2) / 2).toString();
}

或者您可以使用字符串替换.replace(/[^0-9\.]/g, "")执行正则表达式检查。这只允许数字和句点/小数点。 不幸的是,它不会阻止多个小数点。

如果您想限制实际击键,则需要更多内容。将以下函数附加到文本框的keyup事件中。请务必使用return isValidKey(this, event)而不是isValidKey(this, event)

function isValidKey(me, evt) {

    var charCode = (evt.which) ? evt.which : event.keyCode;
    var currValue = me.value;

    // disallow decimal point if it is not the first one
    if ((charCode == 46 || charCode == 110 || charCode == 190) && currValue.indexOf(".") != -1)
        return false;

    // disallow non numeric characters
    if (charCode != 46 && charCode > 31 && (charCode < 48 || charCode > 57))
        return false;

    return true;
}

http://jsfiddle.net/SHJsz/

更新:现在稍微严格一点,但仍然不是万无一失。如果用户使用退格键或删除删除原始起始号,您仍然可以使用前导0的数字或以小数点开头。

http://jsfiddle.net/SHJsz/1/

答案 1 :(得分:0)

有jquery插件可以处理屏蔽输入。

Masked Input Plugin

答案 2 :(得分:0)

你可以看一下:

http://digitalbush.com/projects/masked-input-plugin/

但它并没有完全解决你的问题,只是允许一个掩码,而不是预定义的值。您可以根据需要修改插件代码。

对于这个控件,我会放上递增/递减的向上和向下箭头,我会允许自由文本在失去焦点时验证并将值向上舍入到最接近的一半。我认为这将是最方便的。当他们不允许你输入文字时,面具可能很烦人。