如何格式化预先填充的输入字段

我在页面加载时使用来自API调用的数据填充电话输入字段。如何格式化预先填充的输入字段

我有一个格式化电话号码的功能，如下所示：+1（888）333 4444。但是这个函数只有在有keyup事件的时候才会起作用。我正尝试使用这个相同的函数来获取这个预先填充的输入值。我试图从keyup改变事件加载，onload，但它没有影响。我试图在setTimeout延迟中包装函数，但那也不起作用。

我知道我失去了一些东西简单...

<!DOCTYPE html> 
<html> 
    <body> 
    <form> 
     <label>Telephone</label> 
     <input type="tel" onload="phoneMask()" value="<?= data.phone ?>"/> 
    </form> 

    <script> 
    //Format telephone numbers 
    function phoneMask() { 
     var num = $(this).val().replace(/\D/g,''); 
     $(this).val('+' + num.substring(0,1) + ' (' + num.substring(1,4) + ') ' + num.substring(4,7) + ' ' + num.substring(7,18)); 
    }; 
    $('[type="tel"]').keyup(phoneMask) 
    </script> 
    </body> 
</html>

来源

2017-04-13 Deven Blackburn

在页面的底部，在脚本中添加该：

function phoneMask() { 
    var num = $("input[type=tel]").val().replace(/\D/g,''); 
    $("input[type=tel]").val('+' + num.substring(0,1) + ' (' + num.substring(1,4) + ') ' + num.substring(4,7) + ' ' + num.substring(7,18)); 
    }; 

$(document).ready(function() { 
    phoneMask(); 
});

我已经编辑好phoneMask功能。这将在页面加载完成后调用您的phoneMask函数。

这个假设只存在一个类型为tel的盒子。否则，你将需要将代码包装在phoneMask中，每个代码都使用每个选择器。

来源

2017-04-13 19:58:59 Simon

我在标签上面复制并粘贴了这个标签，但没有运气。 –

我使用更新后的代码编辑了我的原始回复。 – Simon

啊，我看到了，这完美的作品。谢谢@西蒙！ –

如何格式化预先填充的输入字段

回答

相关问题