想要阻止用户在文本字段中输入任何空格

时间:2015-06-05 10:43:12

标签: javascript regex extjs qtip

我在Extjs中有一个文本字段。此文本字段只能包含

  • Digits 0 - 9
  • Alphabets a-z or A-Z
  • _(下划线)和-(连字符)
  • 等字符

我想阻止用户输入除这些字符之外的任何内容。因此,我希望显示一个错误,例如红色下划线以及helptext,以通知用户错误的原因。

请告知如何防止用户输入除上述字符之外的任何内容并显示错误消息。

3 个答案:

答案 0 :(得分:3)

使用maskRe属性:

  

将用于过滤的输入掩码正则表达式   击键(键入的字符)不匹配。注意:确实如此   不过滤输入中已有的字符。

maskRe: /[A-Za-z0-9\-_]/

工作示例:https://fiddle.sencha.com/#fiddle/o4b

答案 1 :(得分:1)

像这样的东西。 keypresskeydown在不同浏览器上存在大量问题,但我相信这应该适用于大多数/所有现代浏览器而不会出现问题。



var errorDiv = document.getElementById('error'),
    testInp = document.getElementById('test');

testInp.addEventListener('keypress', function (evt) {
    var code = evt.keyCode || evt.charCode;

    if (code >= 48 && code <= 57 || code >= 65 && code <= 90 || code >= 97 && code <= 122 || code === 45 || code === 95) {

        errorDiv.classList.add('hidden');
    } else {
        evt.preventDefault();
        errorDiv.classList.remove('hidden');
    }
}, false);

testInp.addEventListener('keydown', function (evt) {
    var code = evt.keyCode || evt.charCode;

    if (code === 8 || code >= 37 && code <= 40|| code === 46) {
        errorDiv.classList.add('hidden');
    }
}, false);
&#13;
#error {
    color: red;
}
.hidden {
    visibility: hidden;
}
&#13;
<input id="test" type="text" />
<div id="error" class="hidden">As such I wish to display an error, something like a red underline along with helptext to notify the user as to why the error is there.</div>
&#13;
&#13;
&#13;

答案 2 :(得分:0)

您可以添加事件键盘并检查输入键值。

例如对于空格:

object

或者别的什么。你可以看看:

listeners: {
        keyup: function(field, e) {
             var key = e.getKey(); 
             if (key == 32){
                 alert("Hey dude, what are you doing?");
             }
       }
 }

希望这有帮助。