Javascript 使用jquery屏蔽电话号码-带有三个输入字段

我想使用jquery/javascript创建电话字段屏蔽。我尝试了几个jquery掩码插件。仍然希望找到更好的解决方案。我有三个美国输入字段（我必须有三个输入字段）

区号

电话区1

电话区2

我的问题是，当用户错误地键入电话号码，然后想在中间插入一个号码时，它应该在不影响其他输入的情况下工作。 例如：

如果用户输入的输入为

第一个输入字段：“abc”

第二个输入字段：“def”

第三个输入字段：“gh”

用户希望在“D”和“E”中间输入“X”。 然后输入应接受输入为 abc、dxe、fgh分别（它应该工作在自动下一个输入字段焦点）

请注意：三个输入字段是必需的

谢谢。

请尝试以下代码：（我正在使用id进行输入，您需要从输入框中删除maxlength属性）

试一试

仅在一个

文本框中使用它。我可以在多个文本框上使用它吗。
maxlength=3
不起作用。您需要将最后一个元素添加到另一个文本框中
您能给我们看一下您剪断的代码吗？它应该可以自动下一个输入字段聚焦，这对我帮助很大。谢谢：）这将把当前输入框的值移动到下一个输入框。但是，即使我插入了第二个数字，当前输入框中的“光标”也移动到了当前输入框的末尾（这可能是因为复制了子字符串值并粘贴了它）。我们也将非常感谢您的帮助。
$("#first").on("input",function(e){
    if($("#first").val().length>3){
        $("#first").val($("#first").val().substring(0,3));
    }
});    

$('#two').val($('#one').val().substring(3,4)+$('#two').val());
$('#one').val($('#one').val().substring(0,3));
$('#two').focus();