javascript - 使用 jQuery 使用 split 或 length 将 div 中的 10 位数字拆分为 3,3,4

Question

使用 Digital Bush 的 maskedInput 插件格式化电话号码，然后将该电话号码从掩码中分离出来并放入 div 中。我需要将该 div 内容拆分为 3,3 和 4...即我需要将其分为 3 个输入(最终将被隐藏)以将其发送回服务器。到目前为止，除了分割之外，我一切正常，我可能使用了错误的方法，而不是使用长度来分解它。

这是我现在所拥有的一个工作 fiddle :

JS FIDDLE

我这里有这个:

 <input id="txtPhoneNumber" name="FancyPhoneNumber" class="required phone" type="text" />
        <div id="txtHiddenPhoneNumber2"></div>

它接受用户输入并将精简后的值(10 个数字)放入 div 中。然后我将这个 div 放入三个输入字段中。

$("#txtPhoneNumber").mask("(999) 999-9999");
                $("#txtPhoneNumber").blur(function () {
                    $("#txtHiddenPhoneNumber").val("");
                    var charArray = $(this).val().split("");
                    var phoneNumber = "";

                    $.each(charArray, function(index, value) {
                        if (!isNaN(value) && value != " ") {
                            phoneNumber = phoneNumber + value;
                        }
                    });

                    $("#txtHiddenPhoneNumber2").append("<div>"+phoneNumber+"</div>")
                    var data =$('#txtHiddenPhoneNumber2').text();
                    var arr = data.match(/.{3}/g);
                    $("#txtHiddenPhoneNumber2").html("<input type=\"text\" value='"+arr[0] +"'>" + "<input type=\"text\" value='"+arr[1]+"'>" + "<input type=\"text\" value='"+arr[2] +"'>");
                });

它正在工作，因为我只需要它不将最后一个数字发送到用 arr[2] 填充的最后一个输入字段。我假设我试图错误地使用 split 。有什么想法吗？

Answer 1

试试这个代码

$(document).ready(function() {
    $("#txtPhoneNumber").mask("(999) 999-9999");
    $("#txtPhoneNumber").blur(function () {
        $("#txtHiddenPhoneNumber").val("");

        var data =$("#txtPhoneNumber").val();
        var arr = data.match(/\d{3,4}/g);
        $("#txtHiddenPhoneNumber2").html("<input type=\"text\" value='"+arr[0] +"'>" + "<input type=\"text\" value='"+arr[1]+"'>" + "<input type=\"text\" value='"+arr[2] +"'>");
    });
});