使用 jquery 格式化表单中的 phone 数字

Question

我正在尝试使用 jquery 在表单输入字段中格式化 phone 数字，但不确定我做错了什么....

$(document).ready(function() { 
        $('#phone').focusout(function() {

            function phoneFormat(phone) {
                phone = phone.replace(/[^0-9]/g, '');
                phone = phone.replace(/(\d{3})(\d{3})(\d{4})/, "() -");
                return phone;
            }

            var phone = $(this).text();
            phone = phoneFormat(phone);
            $(this).text(phone);
         });
});

Answer 1

你必须改变这个

var phone = $(this).text();
phone = phoneFormat(phone);
$(this).text(phone);

到

var phone = $(this).val();
phone = phoneFormat(phone);
$(this).val(phone);

因为输入字段的值是使用 val() 而不是 text() 检索和设置的。

$('#phone').focusout(function() {

  function phoneFormat() {
    phone = phone.replace(/[^0-9]/g, '');
    phone = phone.replace(/(\d{3})(\d{3})(\d{4})/, "() -");
    return phone;
  }
  var phone = $(this).val();
  phone = phoneFormat(phone);
  $(this).val(phone);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<input type="text" value="" id="phone" />

使用 jquery 格式化表单中的 phone 数字

Formatting a phone number in a form using jquery

jquery

onfocus