Question

问题：

是否可以在自动完成中自动添加短划线“ - ”？

假设我有一个电话号码字段，如果有人在其中输入电话号码，则会显示浏览器自动完成。

实施例。

这是浏览器自动完成的值 1234567890

一旦他们选择了我想自动将其格式化为此

123-456-7890

因为有些网站在他们的手机字段中没有验证格式，您可以继续输入10位数字，一旦您在浏览器缓存中输入该数字，它也会显示在其他手机字段中。

提前致谢。

Answer 1

$('#phone-number-field').keyup(function(){
    $(this).val($(this).val().replace(/(\d{3})\-?(\d{3})\-?(\d{4})/,'$1-$2-$3'))
});

Answer 2

您可以尝试使用此代码。

$(function () {

    $('#txtnumber').keydown(function (e) {
       var key = e.charCode || e.keyCode || 0;
       $text = $(this); 
       if (key !== 8 && key !== 9) {
           if ($text.val().length === 3) {
               $text.val($text.val() + '-');
           }
           if ($text.val().length === 7) {
               $text.val($text.val() + '-');
           }

       }

       return (key == 8 || key == 9 || key == 46 || (key >= 48 && key <= 57) || (key >= 96 && key <= 105));
   })
});

HTML输入

<input id="txtnumber"   type="text" maxlength="12" placeholder="xxx-xxx-xxxx" />

您也可以在jsfiddle中看到

https://jsfiddle.net/karthikjsf/38vdpj4f/

Answer 3

上面的答案很好，但是我在复制粘贴时遇到了一个问题，该粘贴是数字以外的其他字符的输入，所以我使用了：

  $('#help_number').keyup(function(){
    $(this).val($(this).val().match(/\d+/g).join("").replace(/(\d{3})\-?(\d{3})\-?(\d{4})/,'$1-$2-$3'))
  });

示例：

str="34%^gd 5-67 6-6ds897"

str.match(/\d+/g).join("")

输出为：>>“ 3456766897”

str.match(/\d+/g).join("").replace(/(\d{3})\-?(\d{3})\-?(\d{4})/,'$1-$2-$3')

输出为：345-676-6897

在自动完成电话号码中添加短划线

3 个答案: