阻止用户输入某些字符?

时间:2017-05-16 07:42:29

标签: javascript

我需要一个只能接受数字的字段,但不允许使用“+”,“ - ”,“*”和“/”等字符。 0也不能是第一个数字。如果我创建一个输入字段并将其类型设置为“数字”,我仍然可以写入至少“+”和“ - ”,而我似乎无法阻止用户将0写为第一个数字

$('input#update-private-ext').on('keydown', function (e) {
    var value = String.fromCharCode(e.keyCode);
    if ($(this).text.length == 0 && value == 0) {
        return false;
    }
});

以上是我第一次尝试让函数不允许0作为第一个字符,但它似乎不起作用。它只是让我写0作为第一个字符。我也试过这个以阻止迹象出现:

$('input#update-private-ext').on('keydown', function (e) {
    var badChars = '+-/*';
    var value = String.fromCharCode(e.keyCode);
    if ($(this).text.length == 0 && value == 0) {
        return false;
    }
    if (badChars.indexOf(value) == -1) {
        return false;
    }
});

但是通过badChars检查,我无法在我的字段中写任何。那我在这里错过了什么?

3 个答案:

答案 0 :(得分:1)

您应该使用e.key来获取当前键。 String.fromCharCode(e.keyCode)给出了错误的结果。

此外,您应该检查不良字符是否 -1。如果是,那么你的字符是一个坏字符,所以你应该输入if。

如果你想获得输入字段的长度,你应该使用jQuery的.val()而不是.text()。或者你可以使用this.value.length在没有jQuery的情况下完成它。

$('input#update-private-ext').on('keydown', function (e) {
        var badChars = '+-/*';
        var value = e.key;
        if (this.value.length == 0 && value == '0') {
            return false;
        }

        if (badChars.indexOf(value) !== -1) {
            return false;
        }
    });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="update-private-ext">

答案 1 :(得分:1)

比较数字和字符串时,必须记住使用48 to 57中的字符代码对数字进行编码,并且在JavaScript中比较字符串是容易出错的,因为存在许多隐式强制。您应该比较相同类型的对象以避免混淆。

在您的情况下,比较应该以解析String.fromCharCode等于'0' - 零字符(字符串)的字符串的方式进行,而不是0作为号。

还有keyCode解析的问题会产生符号的奇怪值,因为您必须手动考虑在解析时是否按下Shift和其他元键。省去麻烦,只需使用e.key获取解析后的密钥值。

顺便说一下,请看this and $(this)之间的区别。基本上,在您的情况下,它意味着输入字段的实际实例是JQuery迭代器的第一个元素 - $(this)[0]。然后,您可以使用this,它会自动设置为事件处理程序中的目标元素。

请参阅以下示例,在打印出调试信息的情况下阻止前0:

&#13;
&#13;
$('input#update-private-ext').on('keydown', function (e) {
    var value = e.key;
    
    console.log('Typed character:');
    console.log(value);
    
    console.log('$(this)');
    console.log($(this));
    
    console.log('this (input element):');
    console.log(this);
    
    console.log("input's value:");
    console.log(this.value);
    
    if (this.value.length == 0 && value == '0') {
        console.log('blocked');    
        return false;
    }
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="update-private-ext" />
&#13;
&#13;
&#13;

为了阻止其他字符,您可以按以下方式过滤它们(请记住,indexOf在找不到索引时返回-1):

&#13;
&#13;
$('input#update-private-ext').on('keydown', function (e) {
    var badChars = '+-/*';
    var value = e.key;
    if (this.value.length == 0 && value == '0') {
        return false;
    }
    //Please note NOT EQUALS TO -1 which means not found.
    if (badChars.indexOf(value) !== -1) {
        return false;
    }
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="update-private-ext" />
&#13;
&#13;
&#13;

答案 2 :(得分:0)

您可以执行以下操作:
1.如果badChars.indexOf(v) >= 0检查坏字符 2.通过检查输入是否从0开始,禁止从0开始,如果是,则将输入字段设置为空白。

这可以给你一个开始!

&#13;
&#13;
$('input#update-private-ext').on('keydown', function(e) {
  var badChars = '+-/*';
  var v = e.key;
  if (badChars.indexOf(v) >= 0) {
    return false;
  }
  if ($(this).val().startsWith('0')) {
    $(this).val("");
    return false;
  }

});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="update-private-ext" />
&#13;
&#13;
&#13;