如何使用jQuery格式化电话号码

Question

我目前正在显示电话号码2124771000.但是,我需要以更易于阅读的形式格式化数字,例如:212-477-1000.这是我目前的HTML:

<p class="phone">2124771000</p>

Answer 1

简单:http://jsfiddle.net/Xxk3F/3/

$('.phone').text(function(i, text) {
    return text.replace(/(\d{3})(\d{3})(\d{4})/, '$1-$2-$3');
});

或者:http://jsfiddle.net/Xxk3F/1/

$('.phone').text(function(i, text) {
    return text.replace(/(\d\d\d)(\d\d\d)(\d\d\d\d)/, '$1-$2-$3');
});

注意:.text()方法不能用于输入元素.对于输入字段文本,请使用.val()方法.

Answer 2

var phone = '2124771000',
    formatted = phone.substr(0, 3) + '-' + phone.substr(3, 3) + '-' + phone.substr(6,4)

Answer 3

不要忘记确保您使用纯整数.

var separator = '-';
$( ".phone" ).text( function( i, DATA ) {
    DATA
        .replace( /[^\d]/g, '' )
        .replace( /(\d{3})(\d{3})(\d{4})/, '$1' + separator + '$2' + separator + '$3' );
    return DATA;
});

Answer 4

以下是其中一些答案的组合.这可以用于输入字段.处理7位和10位长的电话号码.

// Used to format phone number
function phoneFormatter() {
  $('.phone').on('input', function() {
    var number = $(this).val().replace(/[^\d]/g, '')
    if (number.length == 7) {
      number = number.replace(/(\d{3})(\d{4})/, "$1-$2");
    } else if (number.length == 10) {
      number = number.replace(/(\d{3})(\d{3})(\d{4})/, "($1) $2-$3");
    }
    $(this).val(number)
  });
}

实例:JSFiddle

我知道这并没有直接回答这个问题,但是当我查找答案时,这是我发现的第一页.所以这个答案适合任何寻找类似于我所寻找的东西的人.

Answer 5

使用库来处理电话号码。Google的Libphonenumber是您最好的选择。

// Require `PhoneNumberFormat`.
var PNF = require('google-libphonenumber').PhoneNumberFormat;

// Get an instance of `PhoneNumberUtil`.
var phoneUtil = require('google-libphonenumber').PhoneNumberUtil.getInstance();

// Parse number with country code.
var phoneNumber = phoneUtil.parse('202-456-1414', 'US');

// Print number in the international format.
console.log(phoneUtil.format(phoneNumber, PNF.INTERNATIONAL));
// => +1 202-456-1414

我建议通过seegno 使用此软件包。