防止某些字符被输入到文本输入中

Question

我已经阅读了许多与此类似的问题。并且一些解决方案有效。但是，我可以让它工作的唯一方法是允许输入字符，然后将其删除。它看起来很乱，感觉很hacky。

我首先如何防止字符被输入？

演示：https://jsfiddle.net/jf8bqp5z/

HTML：

<input type="text" name="test" id="test"/>

jQuery:

$('#test').keyup(function(e){
    var $this = $(this);
    var val = $this.val();

    if( val.indexOf('.') ){
        val = parseInt(val);
        $this.val(val);
        e.preventDefault();
    }
});

解决方案

其实很简单。我已将keyup 事件切换为keydown，然后查找keyCode：

$('#test').keydown(function(e){
    var $this = $(this);
    var val = $this.val();

    if( e.keyCode === 65 ){     //Here provide the JavaScript event keycode of the key to prevent being typed.
        e.preventDefault();
    }
});

演示：https://jsfiddle.net/j80hryvm/

注意：您可以从http://keycode.info/获取keycode

Answer 1

我找到了这个answer，它从不打印您不想打印的字符。

您可以通过阻止 keyPress 事件来完成此操作 发生在非数值上

例如（使用 jQuery）

$('.input-selector').on('keypress', function(e){
  return e.metaKey || // cmd/ctrl
    e.which <= 0 || // arrow keys
    e.which == 8 || // delete key
    /[0-9]/.test(String.fromCharCode(e.which)); // numbers
})

这说明了所有不同类型的输入（例如，来自 数字键盘的代码与键盘不同）以及 退格键、方向键、control/cmd + r 重新加载等

Answer 2

您可能需要return false:

$('#test').keyup(function(e){
    var $this = $(this);
    var val = $this.val();

    if( val.indexOf('.') ){
        val = parseInt(val);
        if (val == NaN)
            return false;
        $this.val(val);
        e.preventDefault();
    }
});