角度/正则表达式中输入框中的空格问题?我需要限制第一个空格,然后允许用户在第一个字符之后输入空格



我不想允许用户在第一个字符中输入空格,也不想限制用户使用 3 个特殊字符。

他应该能够在第一个单词后按空格键。 我已经将 REGEX 与指令一起使用,并且我能够实现其中的大部分。 问题是用户无法在输入框中的任何位置输入空格。

正则表达式的帮助将不胜感激。 我也附上了一个 plunker 链接。 https://plnkr.co/edit/05fqqyAn7LRr9vOtri4b?p=preview

var app = angular.module('plunker', []);
app.controller('MainCtrl', function($scope) {
$scope.name = 'World';
});
app.directive("regExInput", function(){
"use strict";
return {
restrict: "A",
require: "?regEx",
scope: {},
replace: false,
link: function(scope, element, attrs, ctrl){
element.bind('keypress', function (event) {
var regex = new RegExp(attrs.regEx);
var key = String.fromCharCode(!event.charCode ? event.which : event.charCode);
if (!regex.test(key)) {
event.preventDefault();
return false;
}
});
}
};
});
<html ng-app="plunker">
<head>
<meta charset="utf-8" />
<title>AngularJS Plunker</title>
<script>document.write('<base href="' + document.location + '" />');</script>
<link rel="stylesheet" href="style.css" />
<script data-require="angular.js@1.3.x" src="https://code.angularjs.org/1.3.14/angular.js" data-semver="1.3.14"></script>
<script src="app.js"></script>
</head>
<body ng-controller="MainCtrl">
<p>INSane {{name}}!</p>

<div>
<input type="text" reg-ex-input reg-ex="^[^-s&</][ws-]*$" />
</div>
</body>
</html>

这是你的正则表达式的意思,一点一点

^         Beginning of string
[^        Any character that's not one of the following:
-         Literal '-' character
s        Whitespace
&         Literal '&' character
<         Literal '<' character
/         Literal '/' character
]
[         One of the following characters:
w         Literal 'w'
s         Literal 's'
-         Literal '-'
]
*         ...repeated 0 or more times
$         End of string

如果您的意图是使第一个字符之后的字符是单词字符、空格或字符"-">,则应将[ws-]替换为[ws-],因为w表示"单词字符",s表示空格,而不是文字字符ws

第二个问题是指令本身。该指令将单个字符输入与为整个字符串设计的正则表达式进行比较:

if (!regex.test(key)) {
event.preventDefault();
return false;
}

如果要测试整个字符串的有效性,在keypress事件中执行此操作将不起作用。按键事件只告诉您按下了哪个键,而不是接受按键时生成的字符串。通常,您需要在值更改根据正则表达式验证整个字符串,例如在input事件中。这意味着您将无法取消按键,但无论如何,这将是一个不寻常的用户体验。例如,退格键和箭头键是按键,在正则表达式的上下文中评估它们没有多大意义。您可能需要考虑验证UX,而不是按键预防。

最新更新