Heim > Artikel > Web-Frontend > Wie schreibe ich eine internationale Handynummer mit JavaScript?

Wie schreibe ich eine internationale Handynummer mit JavaScript?

WBOYnach vorne: 2023-08-25 13:41:111739Durchsuche

如何使用 JavaScript 以国际方式编写手机号码？

Wenn Sie Besucher aus der ganzen Welt auf Ihrer Website haben, ist es am besten, Informationen wie Mobiltelefonnummern nach internationalen Standards anzuzeigen. Sie sind also leicht zu verstehen.

Mit dem International Public Telecommunications Numbering Format können wir Mobiltelefonnummern international darstellen. Darüber hinaus wird es im Format „E-164“ dargestellt.

Wir haben die folgende Syntax zum Schreiben von Mobiltelefonnummern auf internationale Weise angegeben.

[+] [country code] [local phone number]

Benutzer können sehen, dass internationale Telefonnummern ein „+“ vor und „Ländervorwahl“ dahinter enthalten und lokale Telefonnummern der Landesvorwahl folgen.

Hier verwenden wir reguläre Ausdrücke und die Methode match(), um Mobiltelefonnummern mithilfe von JavaScript auf internationale Weise zu konvertieren.

Grammatik

Benutzer können der folgenden Syntax folgen, um Mobiltelefonnummern in das internationale Standardformat zu konvertieren.

let reg = /^(\d{3})(\d{3})(\d{4})$/;
let array = number.match(reg);

In der obigen Syntax haben wir den regulären Ausdruck so geschrieben, dass er mit der Telefonnummer übereinstimmt

Die Methode

match gibt ein Array aller Übereinstimmungen zurück. Bei einer gültigen Übereinstimmung werden vier Elemente zurückgegeben. Das erste Element ist die gesamte dreistellige Telefonnummer, das zweite Element sind die ersten drei Ziffern der Telefonnummer, das dritte Element sind die mittleren drei Ziffern der Telefonnummer und das vierte Element sind die letzten vier Ziffern einer gültigen Telefonnummer Nummer.

Regulärer Ausdruck erklärt

^ − Dies ist der Anfang des regulären Ausdrucks.
(d{3}) – Es stellt die ersten drei Ziffern dar.
(d{3}) – stellt die mittleren drei Ziffern dar.
(d{4}$) – Es stellt die letzten vier Ziffern dar.

Beispiel

Im folgenden Beispiel haben wir eine HTML-Eingabe vom Typ Nummer hinzugefügt. Benutzer können eine gültige 10-stellige Mobiltelefonnummer eingeben. Wenn der Benutzer auf die Schaltfläche „Senden“ klickt, führt er die Funktion writeInternationalNumber() aus. Wir verwenden den obigen regulären Ausdruck in der Funktion, um die Eingabewerte abzugleichen und die übereinstimmenden Werte im Array-Format zu erhalten.

Danach verketten wir die Array-Werte zu einer einzigen Zeichenfolge, um die Mobiltelefonnummer gemäß internationalen Standards zu schreiben.

<html>
<body>
   <h3>Using the <i> Regular expression </i> to write a cell phone number in an international way in JavaScript </h3>
   <p>Enter phone number:</p>
   <input type = "number" id = "cell">
   <div id = "content"></div>
   <button id = "btn" onclick = "writeInternationalNumber()"> Submit</button>
   <script>
      let content = document.getElementById('content');
      
      // function to write a cell phone number in the international format
      function writeInternationalNumber() {
         let cell = document.getElementById('cell');
         let number = cell.value;
         let reg = /^(\d{3})(\d{3})(\d{4})$/;
         let array = number.match(reg);
         if(array == null) {
            content.innerHTML = "Please enter a valid phone number";
            return;
         }
         let internationalNumber = '+91' + ' (' + array[1] + ') ' + array[2] + '-' + array[3];
         content.innerHTML = "The converted phone number is " + internationalNumber;
      }
   </script>
</body>
</html>

Beispiel

Im folgenden Beispiel haben wir eine Dropdown-Liste mit Ländercodes unter Verwendung ihrer Werte erstellt. Benutzer können ein beliebiges Land auswählen und eine 10-stellige Telefonnummer in das Eingabefeld eingeben. Wenn der Benutzer die Taste drückt, führt er die Funktion cellNumberWithCountryCode() aus, die den Wert der ausgewählten Landesvorwahl und Telefonnummer abruft. Danach erstellen wir wie im obigen Beispiel gezeigt eine Zeichenfolge, um die eingegebene internationale Mobiltelefonnummer zu schreiben.

<html>
<body>
   <h3>Using the <i> Regular expression </i> to write a cell phone number in an international way in JavaScript </h3>
   <select name = "country_code" id = "codes">
      <option value = "+91" selected> India (+91) </option>
      <option value = "+355"> Albania (+355) </option> 
      <option value = "+1"> USA (+1) </option>
      <option value = "+43"> Austria (+43) </option>
      <option value = "+86"> China (+86) </option>
      <option value = "+81"> Japan (+81) </option>
      <option value = "+31"> Netherlands (+31) </option>
      <option value = "+263"> Zimbabwe (+263) </option>
   </select>
   <input type = "number" id = "cell"> <br>
   <div id = "content"> </div> <br>
   <button id = "btn" onclick = "cellNumberWithCountryCode()"> Submit</button>
   <script>
      let content = document.getElementById('content');
      
      // function to write a cell phone number in the international format
      function cellNumberWithCountryCode() {
         let cell = document.getElementById('cell');
         let number = cell.value;
         let reg = /^(\d{3})(\d{3})(\d{4})$/;
         
         // get the country code from the dropdown
         let country_code = document.getElementById('codes').value;
         let array = number.match(reg);
         if (array == null) {
            content.innerHTML = "Please enter a valid phone number";
            return;
         }
         let internationalNumber = country_code + ' (' + array[1] + ') ' + array[2] + '-' + array[3];
         content.innerHTML = "The converted phone number is " + internationalNumber; 
      }
   </script>
</body>
</html>

Benutzer haben gelernt, Mobiltelefonnummern nach internationalen Standards zu ordnen. Wir verwenden reguläre Ausdrücke, um Mobiltelefonnummern zu validieren. Wenn die Telefonnummer gültig ist, zeigen wir sie international zusammen mit der ausgewählten Landesvorwahl an.

Das obige ist der detaillierte Inhalt vonWie schreibe ich eine internationale Handynummer mit JavaScript?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme：

Dieser Artikel ist reproduziert unter:tutorialspoint.com. Bei Verstößen wenden Sie sich bitte an admin@php.cn löschen

Vorheriger Artikel：Wie stelle ich die Breite eines Dreiecks mit FabricJS ein?Nächster Artikel：Wie stelle ich die Breite eines Dreiecks mit FabricJS ein?

In Verbindung stehende Artikel

Mehr sehen