Question

我有一个字符串，最多可以有14个字符，包括空格。它的格式如下str.len === 14：

var str = 'A1 B2 C3 D4 E5'

我有一个用户正在输入文本的空文本字段。一旦他们输入两个字符，（'A1'）我需要在字符串中添加一个尾随空格。他们输入的下一个字符会使字符串看起来像这样：

'A1 B'

我使用的是javascript，需要使用javascript或regex解决方案来格式化我的字符串作为用户类型。应该没有前导空格，每两个非空白字符后面有一个空格，不超过14个字符，包括空格（第14个字符末尾没有尾随空格）。

到目前为止，我已经尝试过这个：

str.replace(/(..)/g,"$1 ")

但是，仅当str已经是10个字符的字符串时才有效。当您键入空格时，会将空格添加到字符串中，并抛出索引。

如果使用javascript，只要输入字符串就可以正常工作，我也试过了一些组合。但是如果用户通过添加到字符串的开头来编辑7个字符的字符串，它就会抛弃所有内容：

if (str.length === 14) {
    return;
}
if (str.length > 0 && str.length % 3 === 2) {
    newValue = newValue + ' ';
}

欢迎任何建议。

Answer 1

您似乎期望人们输入 HEX ，为什么不更严格并删除＆amp;每次重新添加空格，然后限制输入

var str = 'A1B';
str.replace(/0x|[^0-9a-zA-Z]/g, '').replace(/(..)(?!$)/g, '$1 ').slice(0, 14);
// "A1 B"
// and possibly set cursor position
// (do the char removal on [0..old_pos] to figure out char difference to new_pos)

这也将解决输入中间的粘贴或输入等问题，因为空格将始终移动到它们应该的位置

// or e.g. str = 'A1B2C3D4E5F6'; // longer than expected
// becomes
// "A1 B2 C3 D4 E5"

额外备注

我剥离0x，因为它是您不需要但可以粘贴的常用十六进制前缀
(?!$)会阻止尾随空格
对于某个正整数3x - 1，您的最大长度应始终为x（14也是如此）

Answer 2

它可能不是最优雅的代码，但在每个添加字母或数字的密钥后，我都会按照以下流程执行代码：

获取光标位置
获取字符串
从字符串
在您想要的位置重新添加空格
将光标放回原位

Answer 3

formatter.js库的解决方案：

new Formatter(document.getElementById('text'), {
  'pattern': '{{**}} {{**}} {{**}} {{**}} {{**}}'
});

<script src="http://firstopinion.github.io/formatter.js/javascripts/formatter.js"></script>
<input type="text" id="text" />

Javascript / Regex用于在键入时格式化字符串

3 个答案: