在键盘输入期间,在每 n 个字符后放置破折号

put dash after every n character during input from keyboard

本文关键字:字符 破折号 在每 输入 键盘      更新时间:2023-09-26
$('.creditCardText').keyup(function() {
  var foo = $(this).val().split("-").join(""); // remove hyphens
  if (foo.length > 0) {
    foo = foo.match(new RegExp('.{1,4}', 'g')).join("-");
  }
  $(this).val(foo);
});

我从这里找到了这个关于每 4 个字符后放置破折号的教程,我的问题是如果字符间隔不像本例中那样恒定,它只是在每 4 个字符之后怎么办,如果间隔3 characters "-" 2 characters "-" 4 characters "-" 3 characters "-",所以它会看起来像这样123-12-1234-123-123

在这种情况下,只写普通代码来解决问题更方便:

function format(input, format, sep) {
    var output = "";
    var idx = 0;
    for (var i = 0; i < format.length && idx < input.length; i++) {
        output += input.substr(idx, format[i]);
        if (idx + format[i] < input.length) output += sep;
        idx += format[i];
    }
    output += input.substr(idx);
    return output;
}

示例用法:

function format(input, format, sep) {
    var output = "";
    var idx = 0;
    for (var i = 0; i < format.length && idx < input.length; i++) {
        output += input.substr(idx, format[i]);
        if (idx + format[i] < input.length) output += sep;
        idx += format[i];
    }
    output += input.substr(idx);
    return output;
}
$('.creditCardText').keyup(function() {
    var foo = $(this).val().replace(/-/g, ""); // remove hyphens
    // You may want to remove all non-digits here
    // var foo = $(this).val().replace(/'D/g, "");
    if (foo.length > 0) {
        foo = format(foo, [3, 2, 4, 3, 3], "-");
    }
  
    
    $(this).val(foo);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input class="creditCardText" />

虽然可以使用正则表达式进行部分匹配和捕获,但必须使用替换功能进行替换。在替换函数中,我们需要确定有多少捕获组实际捕获了一些文本。由于正则表达式没有干净的解决方案,因此我编写了一个更通用的函数,如上所示。

您可以使用正则表达式拆分它。 在这种情况下,我使用表达式来检查间隔为 3-2-4-3 的非空格。

RegExp.exec 将返回一个"match"数组,第一个元素包含实际字符串。 删除匹配的第一个元素后,您可以使用破折号将它们连接起来。

var mystring = "123121234123"
var myRegexp = /^([^'s]{3})([^'s]{2})([^'s]{4})([^'s]{3})$/g
var match = myRegexp.exec(mystring);
if (match)
{
    match.shift();
    mystring = match.join("-")
    console.log(mystring)
}

根据进一步的评论,操作澄清了他们需要一个固定的间隔来插入破折号。在这种情况下,有几种方法可以实现它;我认为正则表达式可能是最糟糕的,换句话说,矫枉过正和过于复杂的解决方案。

一些更简单的选择是创建一个新的字符数组,并在循环中逐个字符附加,每次到达所需的索引时也添加一个破折号。这可能是事后最容易写和摸索的,但更冗长一些。

或者,您可以转换为字符数组并使用"在索引处插入数组"类型的函数,例如splice()(有关一些示例,请参阅在特定索引处将项目插入数组或在其他字符串的位置 x 处插入字符串)。

传递输入值和索引以附加分隔符,首先,它将删除现有的分隔符,然后仅在位置索引上附加分隔符。

export function addSeparators(
  input: string,
  positions: number[],
  separator: string
): string {
  const inputValue = input.replace(/-/g, '').split(''); // remove existing separators and split characters into array
  for (let i = 0; i < inputValue.length; i++) {
    if (positions.includes(i)) inputValue.splice(i, 0, separator);
  }
  return inputValue.join('');
}