Mascheramento del numero di telefono utilizzando jquery - con tre campi di input

Question

Desidero creare il mascheramento del campo Phone utilizzando jquery/javascript. Ho provato alcuni plugin per maschere jquery. Vuole ancora trovare una soluzione migliore per questo. Ho tre campi di input per gli Stati Uniti (devo avere tre campi di input).

prefisso

Telefono campo1

Telefono field2

La mia domanda è, quando l'utente a torto digitare i numeri di telefono, e poi vuole inserire un numero in mezzo, dovrebbe funzionare senza influenzare altri input.

Esempio:

Se l'utente digita come ingressi

primo campo di introduzione: "abc"

secondo campo di input: "def"

terzo campo di introduzione: "gh"

Quindi l'utente desidera inserire "x" nel mezzo di "d" & "e". Quindi l'input deve accettare l'input come abc, dxe, fgh rispettivamente (dovrebbe funzionare in automatico il prossimo campo di input).

Nota: sono necessari tre campi di input.

Grazie.

Answer 1

provare this link

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

Usandolo su un textbox solo. Posso usarlo su più caselle di testo. maxlength=3 non funziona. Devi inserire l'ultimo elemento nell'altra casella di testo

Answer 2

provare il seguente codice: (sto usando id per l'input ed è necessario rimuovere l'attributo maxlength dalle caselle di input)

$("#first").on("input",function(e){ 
    if($("#first").val().length>3){ 
     $("#first").val($("#first").val().substring(0,3)); 
    } 
});