Formatieren von vorgefüllten Eingabefeldern

Ich beziehe ein Telefoneingabefeld mit Daten aus einem API-Aufruf, wenn die Seite geladen wird.Formatieren von vorgefüllten Eingabefeldern

Ich habe eine Funktion, die Telefonnummern wie folgt formatiert: +1 (888) 333 4444. Die Funktion funktioniert jedoch nur, wenn ein Keyup-Ereignis vorliegt. Ich versuche, diesen vorbelegten Eingabewert mit dieser Funktion zu formatieren. Ich habe versucht, das Ereignis von keyup zu laden, onload, aber es hat keine Auswirkungen. Ich habe versucht, die Funktion in eine setTimeout-Verzögerung zu verpacken, aber das hat auch nicht funktioniert.

Ich weiß, ich bin etwas fehlt einfach ...

<!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>

Quelle

2017-04-13 Deven Blackburn

Am unteren Rand der Seite, in dem Skript in diesem Abschnitt hinzufügen:

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(); 
});

Ich habe Ihre phoneMask Funktion bearbeitet. Dies ruft Ihre phoneMask-Funktion auf, sobald die Seite geladen wurde.

Dies geht davon aus, dass es nur eine Box vom Typ tel geben wird. Andernfalls müssen Sie den Code in phoneMask umschlingen und jeweils mit dem Selektor verwenden.

Quelle

2017-04-13 19:58:59 Simon

Ich kopierte und klebte das sofort über dem Tag, aber kein Glück. –

Ich habe meine ursprüngliche Antwort mit aktualisiertem Code bearbeitet. – Simon

Ah ich sehe, das funktioniert perfekt. Danke @Simon! –

Formatieren von vorgefüllten Eingabefeldern

Antwort

Verwandte Themen