如何在文本框中只允许电话号码并自动分隔它们？ [复制]

Question

疯狂的长标题是为了避免被标记为重复。

我有一个用于输入 10 位美国电话号码的文本框，例如222-333-4444。我希望在用户输入更多数字时自动添加破折号，类似于 Chrome 处理box flagged as a date 的方式。斜线出现了，但不是真的……在那里。键入 8 个数字会填满日期框。

我还希望仅个数字能够添加到文本框中，并且不超过 10 个。

似乎必须有一个框架可供我使用——这个问题不可能是独一无二的。

我现在只是偶尔插入斜线。

<script>
    $(document).ready(function () {
        var textBox = $("#PhoneNumber");
        $(textBox).keyup(function () {
            var val = textBox.val().replace(/-/g, "");
            val = val.match(/\d{3}(?=\d{2,3})|\d+/g).join("-");
            textBox.val(val);
        });
    });
</script>

Answer 1

JQUery 掩码可能是您正在寻找的： https://igorescobar.github.io/jQuery-Mask-Plugin/

一旦包含，那么它就像

一样简单

  $('.phone').mask('0000-0000');
  $('.phone_with_ddd').mask('(00) 0000-0000');
  $('.phone_us').mask('(000) 000-0000');