在键盘输入时,在每n个字符后加上短划线

时间:2015-01-09 02:20:51

标签: javascript jquery regex

$('.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);
});

我发现这个教程是关于在here的每4个字符之后放置破折号我的问题是如果字符间隔不是常数,就像在这个例子中那样,如果间隔为{{1},则仅在每4个字符之后所以它看起来像这个3 characters "-" 2 characters "-" 4 characters "-" 3 characters "-"

3 个答案:

答案 0 :(得分:8)

在这种情况下,只需编写正常代码来解决问题就更方便了:

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

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

答案 1 :(得分:0)

您可以使用正则表达式拆分它。在这种情况下,我使用表达式检查区间为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)
}

答案 2 :(得分:0)

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

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

或者您可以转换为字符数组,并使用&#39;插入到数组中的索引&#39;类型函数,如splice()(有关某些内容,请参阅Insert Item into Array at a Specific IndexInserting string at position x of another string实施例)。