想要通过在用户输入错误时阻止用户在文本字段中输入任何空格

Question

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

• Digits 0 - 9
• Alphabets az or AZ
• _ （下划线）和- （连字符）之类的字符

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

请提供有关如何防止用户输入上述字符以外的内容并显示错误消息的建议。

Answer 1

使用maskRe属性：

输入掩码正则表达式，将用于过滤不匹配的击键（正在键入的字符）。 注意：它不会过滤输入中已经存在的字符。

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

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

Answer 2

这样的事情。 还有的问题与整个负载keypress和keydown在不同的浏览器，但我相信这应该在大多数/所有现代浏览器的工作没有问题。

 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); 

 #error { color: red; } .hidden { visibility: hidden; } 

 <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> 

Answer 3

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

例如一个空格：

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

或者是其他东西。 您可以看一下：

field.addClass("x-form-invalid")
field.markInvalid("Hey dude, what are you doing?");

希望这可以帮助。