javascript - 无法在屏蔽的电话号码中通过退格键删除

Question

我正在尝试按如下方式屏蔽电话号码:

(123) 131-5135- (x1345)。

其中“1345”是分机号。但是我无法通过退格键删除扩展名。我必须选择扩展名，然后将其删除。代码如下:

<input type="text" id="aphonen" class="form-control" value="" />

<script>
    document.getElementById('aphonen').addEventListener('input', function (e) {
       var a = e.target.value.replace(/\D/g, '').match(/(\d{0,3})(\d{0,3})(\d{0,4})(\d{0,4})/);
       e.target.value = !a[2] ? a[1] : '(' + a[1] + ') ' + a[2] + (a[3] ? '-' + a[3] : '') + (a[4] ? '- (x' + a[4] +')' : '');
    });
</script>

为什么退格键不起作用？

Answer 1

在您的代码中，您必须检查按下了哪个键，如果它不是退格键，则运行您的代码，下面是代码片段:

 var code;

       
      
         document.getElementById('aphonen').addEventListener('input', function (e) {
         if(code !== 8){
           var a = e.target.value.replace(/\D/g, '').match(/(\d{0,3})(\d{0,3})(\d{0,4})(\d{0,4})/);
           e.target.value = !a[2] ? a[1] : '(' + a[1] + ') ' + a[2] + (a[3] ? '-' + a[3] : '') + (a[4] ? '- (x' + a[4] +')' : '');
         }
      });
       

         

window.onkeydown = function (e) {
    code = e.keyCode ? e.keyCode : e.which;
//     console.log(code);
};

<input type="text" id="aphonen" class="form-control" value="" />