Wenn Sie Daten von Benutzern sammeln, gibt es zwei wichtige Herausforderungen. Sammeln dieser Informationen und validieren. Einige Arten von Informationen sind unkompliziert - zum Beispiel könnte das Alter eines Menschen nicht wirklich einfacher sein, um zu sammeln und zu validieren. Die Namen sind nicht so einfach wie sie klingen, aber Sie sorgten für Kantenfälle und internationale Variationen - zum Beispiel Patronymik, Mononymous oder sogar nur Menschen mit gepfedernden Nachnamen - Sie können nicht zu weit falsch gehen (obwohl viele Anwendungen und viele Anwendungen und Dienstleistungen tun!). E -Mail -Adressen haben zwar theoretisch sehr einfach zu validieren, haben jedoch ihre eigenen Herausforderungen - dennoch gibt es viele regelmäßige Ausdrücke in freier Wildbahn, die nicht ganz richtig sind.
und dann gibt es Telefonnummern. Diese sind schwer. Wirklich hart. In diesem Artikel werde ich einige der Herausforderungen beim Sammeln, Validieren und Anzeigen von Telefonnummern erörtern.
Vielleicht denken Sie, da Telefonnummern ein ziemlich starres Format wie folgt folgen:
<br> 202-456-1111<br>
… dass es einfach sein sollte, einen einfachen regulären Ausdruck zu konstruieren, um sie zu validieren. Hier ist eins:
<br>
^(\([0-9]{3}\)|[0-9]{3}-)[0-9]{3}-[0-9]{4}$<br>Halten Sie genau dort an. Für den Anfang finden Sie hier nur einige Variationen der obigen Zahl, die alle vollkommen gültig sind:
<br> 202 456 1111<br> (202) 456 1111<br> 2024561111<br> 1-202-456-1111<br> 1-202-456-1111 x1234<br> 1-202-456-1111 ext1234<br> 1 (202) 456-1111<br> 1.202.456.1111<br> 1/202/456/1111<br> 12024561111<br> +1 202 456 1111<br>
basierend darauf wissen wir, dass der reguläre Ausdrucksgeschein nicht so einfach ist, wie wir es zum ersten Mal dachten - aber das ist nur die Hälfte davon. Diese Beispiele gelten nur für eine US-amerikanische Zahl. Sicher, wenn Sie wissen, dass die Anzahl, die Sie sammeln, für ein bestimmtes Land sein wird, können Sie möglicherweise einen regulären Ausdruck verwenden. Ansonsten wird dieser Ansatz nicht reduziert.
Schauen wir uns einige der anderen Probleme in Bezug auf Telefonnummern an und warum sie unsere Arbeit noch schwieriger machen.
Alle Arten von externen Faktoren können Auswirkungen auf die Telefonnummerierung haben. Ganze Länder kommen und gehen und führen neue Landpräfixe ein. Neue Klassifikationen von Zahlen führen neue Nummerierungssysteme ein-Premium-Rate, lokaler Rate, gebührenfrei usw. Wenn ein Träger aus einer Reihe von Zahlen ausgeht-wie leider Premium-Rate-führen sie einfach ein neues Präfix ein.
Einige Veränderungen haben enorme Auswirkungen; In Großbritannien vor einigen Jahren wurde beispielsweise das gesamte regionale Nummernsystem drastisch geändert, wobei praktisch jeder Vorwahlcode eine zusätzliche „1“ eingefügt wurde. Selbst dann hatte das Kapital ein subtil anderes System. Es dauerte wahrscheinlich ein Jahrzehnt, bis die Beschilderung im ganzen Land geändert wurde, um die Änderungen widerzuspiegeln.
Dann gab es natürlich das enorme und beispiellose Wachstum in Mobilgeräten. Es war nicht mehr die Anzahl der benötigten Telefonnummern, die weitgehend auf die Anzahl der Haushalte beschränkt waren, sondern um ein Vielfaches. Die anhaltende Belastung des Pools der verfügbaren Zahlen kann nur die Wahrscheinlichkeit weiterer Änderungen erhöhen.
Es ist oft wichtig, den internationalen Wählcode einer Nummer zu erfassen. In einigen Fällen kann der Kontext bedeuten, dass er nicht erforderlich ist. Wenn Sie beispielsweise in einem einzigen Land tätig sind und Telefonnummern von einem menschlichen Betreiber verwendet werden, benötigen Sie sie möglicherweise nicht. Für alles, was automatisiert ist - z. B. das Senden von SMS -Nachrichten - oder um sie effektiv zu validieren, müssen Sie das Prefix des Landes erfassen.
Die Bibliothek der Länder enthält eine Reihe geografischer Informationen, die internationale Wählcodes enthalten. Hier ist ein Auszug aus Ländern.json aus dieser Bibliothek:
<br> 202-456-1111<br>
Wie Sie sehen, zeigt dies, dass Österreich den internationalen Wählcode 43 verwendet.
Wie können wir diese Informationen verwenden? Verwenden Sie die Magie von Lodash (oder Unterstrich), es gibt einige Möglichkeiten, wie wir Wählcode-bezogene Informationen abfragen können.
Zum Beispiel, um herauszufinden, ob ein bestimmter Wählcode gültig ist:
<br>
^(\([0-9]{3}\)|[0-9]{3}-)[0-9]{3}-[0-9]{4}$<br>Es gibt natürlich eine effizientere Möglichkeit, dies zu tun, sodass dies und die folgenden Beispiele nicht unbedingt für die Produktion optimiert werden.
wir können die Länder nachschlagen, die einen bestimmten Wählcode verwenden:
<br> 202 456 1111<br> (202) 456 1111<br> 2024561111<br> 1-202-456-1111<br> 1-202-456-1111 x1234<br> 1-202-456-1111 ext1234<br> 1 (202) 456-1111<br> 1.202.456.1111<br> 1/202/456/1111<br> 12024561111<br> +1 202 456 1111<br>
Schließlich können wir die Wählcodes für ein bestimmtes Land erhalten:
<br>
{<br>
"name": {<br>
"common": "Austria",<br>
"official": "Republic of Austria",<br>
// ... //<br>
},<br>
// ... //<br>
"callingCode": ["43"],<br>
// ... //<br>
},<br>Sie finden diese Funktionen als Modul zusammen mit Unit -Tests im Repository, das den Artikel begleitet.
sogar internationale Wählcodes sind jedoch nicht so einfach, wie Sie vielleicht denken. Das Format kann variieren - 1, 43, 962 1868 sind alle gültigen Codes. Es gibt nicht unbedingt eine Eins-zu-Eins-Zuordnung. 44 Zum Beispiel wird nicht nur für das Vereinigte Königreich, sondern auch für die Isle of Man, Guernsey und Jersey verwendet.
Zahlen müssen ebenfalls geändert werden, wo Sie wählen. Aus dem Ausland, um eine britische Nummer anzurufen, müssen Sie das führende Null und das Präfix mit dem Wählcode 44:
fallen lassen
<br> 202-456-1111<br>
… wird…
<br>
^(\([0-9]{3}\)|[0-9]{3}-)[0-9]{3}-[0-9]{4}$<br>Sie können das "" auch durch ein Doppel Null ersetzen:
<br> 202 456 1111<br> (202) 456 1111<br> 2024561111<br> 1-202-456-1111<br> 1-202-456-1111 x1234<br> 1-202-456-1111 ext1234<br> 1 (202) 456-1111<br> 1.202.456.1111<br> 1/202/456/1111<br> 12024561111<br> +1 202 456 1111<br>
Um die Dinge noch weiter zu komplizieren, variieren einige Zahlen von außerhalb eines Landes, je nachdem, welches Land Sie aus wählen. In den USA müssen beispielsweise Zahlen auch mit dem US -Exit -Code 011 vorangestellt werden, sodass das obige Beispiel:
wird
<br>
{<br>
"name": {<br>
"common": "Austria",<br>
"official": "Republic of Austria",<br>
// ... //<br>
},<br>
// ... //<br>
"callingCode": ["43"],<br>
// ... //<br>
},<br>Zum Glück gibt es ein Format, mit dem wir diese Variationen umgehen können.
Zum Glück für Entwickler gibt es einen eindeutigen, international anerkannten Standard für Telefonnummern überall auf der Welt, das E.164 namens E.164. Das Format ist wie folgt unterteilt:
( Quelle )
Hier ist die Zahl von früher, in E.164 -Format:
<span>var _ = require('lodash')
</span><span>, data = require('world-countries')
</span>module<span>.exports = {
</span><span>/**
</span><span>* Determines whether a given international dialing code is valid
</span><span>*
</span><span>* <span>@param string code
</span></span><span>* <span>@return bool
</span></span><span>*/
</span><span>isValid : function(code) {
</span><span>var codes = _.flatten(_.pluck(data, 'callingCode'));
</span><span>return _.contains(codes, code);
</span><span>}
</span><span>// ...
</span><span>}</span>Wir können dasselbe Format für als Beispiel als Beispiel für eine in London ansässige britische Nummer verwenden:
<span>/**
</span><span>* Gets a list of countries with the specified dialing code
</span><span>*
</span><span>* <span>@param string code
</span></span><span>* <span>@return array An array of two-character country codes
</span></span><span>*/
</span><span>getCountries : function(code) {
</span><span>var countryEntries = _.filter(data, function(country){
</span><span>return (_.contains(country.callingCode, code));
</span><span>})
</span><span>return _.pluck(countryEntries, 'cca2');
</span><span>}</span>Wir können jede gültige Telefonnummer unter Verwendung des E.164 -Formats darstellen. Wir wissen, auf welches Land es sich bezieht, und es ist unverwöhnlich - es ist die ideale Wahl für die Lagerung. Es wird auch üblicherweise für telefonisch -basierte Dienste wie SMS -Anbieter verwendet, wie wir etwas später sehen werden.
Es gibt natürlich einen Haken. Der E.164 -Standard ist vielleicht großartig für die Aufbewahrung, aber für zwei Dinge schrecklich. Erstens würde praktisch niemand seine Nummer in diesem Format eingeben oder vorlesen. Zweitens ist es in Bezug auf seine Lesbarkeit hoffnungslos. Später werden wir jedoch sehen, dass es Möglichkeiten gibt, Zahlen für Menschen zu formatieren.
Schauen wir uns zunächst das Problem der Sammlung von Telefonnummern an.
HTML5 führte einen neuen "Tel" -Negeldypen ein. Aufgrund der Probleme in Bezug auf die Variationen im Format ist jedoch keine Einschränkungen für das ein, was der Benutzer eingeben kann, und es führt jedoch keine Validierung auf die gleiche Weise wie beispielsweise das E -Mail -Element durch. Trotzdem gibt es einige Vorteile - wenn sie auf einer mobilen Site verwendet werden, wird normalerweise die Telefon -Tastatur eines Benutzers angezeigt und nicht ein herkömmliches Tastaturlayout.
Sie können ein einzelnes Element verwenden, um eine Zahl zu sammeln:
<span>/**
</span><span>* Gets the dialing codes for a given country
</span><span>*
</span><span>* <span>@param string country The two-character country code
</span></span><span>* <span>@return array An array of strings representing the dialing codes
</span></span><span>*/
</span><span>getCodes : function(country) {
</span><span>// Get the country entry
</span><span>var countryData = _.find(data, function(entry) {
</span><span>return (entry.cca2 == country);
</span><span>});
</span><span>// Return the code(s)
</span><span>return countryData.callingCode;
</span><span>}</span>Alternativ können Sie eine Zahl in separate Elemente unterteilen:
<br> 202-456-1111<br>
Browserunterstützung ist ziemlich gut (z. B. Chrom 6, Firefox 4, Safari 5, dh 10), aber selbst in einem älteren Browser fällt es einfach auf ein einfaches altes Textfeld zurück.
Sollten wir entscheiden, dass ein regulärer Ausdruck ausreicht - und denken Sie daran, dass es Probleme gibt - dann können wir das Musterattribut verwenden, um eine Validierung hinzuzufügen:
<br>
^(\([0-9]{3}\)|[0-9]{3}-)[0-9]{3}-[0-9]{4}$<br>maskierte Eingänge sind eine gemeinsame Technik, um die Benutzereingaben einzuschränken oder Hinweise auf das erwartete Format zu geben. Wenn Sie jedoch nicht sicher sein können, dass die Zahlen immer für ein bestimmtes Land sein werden, ist es sehr schwierig, internationale Variationen zu erfüllen. Es ist jedoch eine Sache, Benutzer zu ärgern, indem sie Annahmen treffen-einen Nicht-US-Benutzer, einen Status und einen Zip-Code bereitzustellen. Es ist eine ganz andere, ein Formular völlig unbrauchbar zu machen, beispielsweise indem sie Menschen dazu zwingen, Zahlen im Format eines bestimmten Landes zu liefern.
Sie können jedoch effektiv sein, wenn Sie wissen, dass bestimmte Zahlen innerhalb eines bestimmten Bereichs liegen. Hier ist ein Beispiel für eine maskierte Eingabe für US -Telefonnummern.
Es gibt eine bessere und flexiblere Möglichkeit, Telefonnummern in Form eines hervorragenden JQuery -Plugins zu sammeln. Es ist unten dargestellt.
Sie können hier auch mit einer Live -Demo spielen.
Nutzung ist einfach - stellen Sie sicher .
Erstellen Sie als nächstes ein Element:
<br> 202 456 1111<br> (202) 456 1111<br> 2024561111<br> 1-202-456-1111<br> 1-202-456-1111 x1234<br> 1-202-456-1111 ext1234<br> 1 (202) 456-1111<br> 1.202.456.1111<br> 1/202/456/1111<br> 12024561111<br> +1 202 456 1111<br>
schließlich intialisieren Sie es wie folgt:
<br>
{<br>
"name": {<br>
"common": "Austria",<br>
"official": "Republic of Austria",<br>
// ... //<br>
},<br>
// ... //<br>
"callingCode": ["43"],<br>
// ... //<br>
},<br>Wenden Sie sich an eine vollständige Liste der Konfigurationsoptionen, wenden Sie sich an die Dokumentation. Später werden wir uns die UtilsScript -Option ansehen, aber zuerst müssen wir uns in eine andere nützliche Bibliothek eintauchen.
Zum Glück gibt es eine Lösung für viele unserer Validierung und Formatierung von Leiden. Die Bibliothek von Google wurde ursprünglich für das Android -Betriebssystem entwickelt und bietet alle möglichen Methoden und Versorgungsunternehmen für die Arbeit mit Telefonnummern. Besser noch, es wurde von Java zu JavaScript portiert, sodass wir es in Web- oder Node.js -Anwendungen verwenden können.
Sie können die Bibliothek von der Projekt -Homepage herunterladen - wie Sie vielleicht erwarten - Google Code.
Sie können es auch über NPM bekommen. Hier ist die Projektseite und um aus der Befehlszeile zu installieren:
<span>var _ = require('lodash')
</span><span>, data = require('world-countries')
</span>module<span>.exports = {
</span><span>/**
</span><span>* Determines whether a given international dialing code is valid
</span><span>*
</span><span>* <span>@param string code
</span></span><span>* <span>@return bool
</span></span><span>*/
</span><span>isValid : function(code) {
</span><span>var codes = _.flatten(_.pluck(data, 'callingCode'));
</span><span>return _.contains(codes, code);
</span><span>}
</span><span>// ...
</span><span>}</span>Sie können es auch mit Bower installieren:
<span>/**
</span><span>* Gets a list of countries with the specified dialing code
</span><span>*
</span><span>* <span>@param string code
</span></span><span>* <span>@return array An array of two-character country codes
</span></span><span>*/
</span><span>getCountries : function(code) {
</span><span>var countryEntries = _.filter(data, function(country){
</span><span>return (_.contains(country.callingCode, code));
</span><span>})
</span><span>return _.pluck(countryEntries, 'cca2');
</span><span>}</span>Wenn Sie darüber nachdenken, es in einem Front-End-Projekt zu verwenden, werden Sie jedoch gewarnt-selbst wenn Sie Minimed und Compressed bei über 200 kb erreichen.
Um die wichtigsten Funktionen der Bibliothek zu demonstrieren, gehe ich davon aus, dass Sie eine Node.js -Anwendung schreiben. Sie finden einen Beispielcode im Repository, der diesen Artikel ergänzt.
Importieren Sie zuerst TelefonUtil:
<br> 202-456-1111<br>
Jetzt können Sie mit seiner Parse () -Methode eine Telefonnummer interpretieren:
<br>
^(\([0-9]{3}\)|[0-9]{3}-)[0-9]{3}-[0-9]{4}$<br>Es gibt eine Reihe von Dingen, die wir damit machen können. Importieren wir zunächst einige Konstanten aus der Bibliothek. Ändern Sie Ihre Erfordernisse in Folgendes:
<br> 202 456 1111<br> (202) 456 1111<br> 2024561111<br> 1-202-456-1111<br> 1-202-456-1111 x1234<br> 1-202-456-1111 ext1234<br> 1 (202) 456-1111<br> 1.202.456.1111<br> 1/202/456/1111<br> 12024561111<br> +1 202 456 1111<br>
Jetzt können wir Folgendes machen:
<br>
{<br>
"name": {<br>
"common": "Austria",<br>
"official": "Republic of Austria",<br>
// ... //<br>
},<br>
// ... //<br>
"callingCode": ["43"],<br>
// ... //<br>
},<br>Die Ausgabe davon ist wie folgt:
<span>var _ = require('lodash')
</span><span>, data = require('world-countries')
</span>module<span>.exports = {
</span><span>/**
</span><span>* Determines whether a given international dialing code is valid
</span><span>*
</span><span>* <span>@param string code
</span></span><span>* <span>@return bool
</span></span><span>*/
</span><span>isValid : function(code) {
</span><span>var codes = _.flatten(_.pluck(data, 'callingCode'));
</span><span>return _.contains(codes, code);
</span><span>}
</span><span>// ...
</span><span>}</span>Versuchen Sie nun, die Nummer ohne den internationalen Wählcode zu analysieren:
<span>/**
</span><span>* Gets a list of countries with the specified dialing code
</span><span>*
</span><span>* <span>@param string code
</span></span><span>* <span>@return array An array of two-character country codes
</span></span><span>*/
</span><span>getCountries : function(code) {
</span><span>var countryEntries = _.filter(data, function(country){
</span><span>return (_.contains(country.callingCode, code));
</span><span>})
</span><span>return _.pluck(countryEntries, 'cca2');
</span><span>}</span>Dies wirft die folgende Ausnahme aus:
<span>/**
</span><span>* Gets the dialing codes for a given country
</span><span>*
</span><span>* <span>@param string country The two-character country code
</span></span><span>* <span>@return array An array of strings representing the dialing codes
</span></span><span>*/
</span><span>getCodes : function(country) {
</span><span>// Get the country entry
</span><span>var countryData = _.find(data, function(entry) {
</span><span>return (entry.cca2 == country);
</span><span>});
</span><span>// Return the code(s)
</span><span>return countryData.callingCode;
</span><span>}</span>Dies liegt daran, dass es unmöglich zu interpretieren ist, ohne ihm zu sagen, für welches Land die Zahl ist. Die Parse () -Methode nimmt einen optionalen zweiten Parameter vor, nämlich der ISO 3166-1 Alpha-2 (d. H. Zwei-Zeichen) Ländercode.
Wenn Sie die Zeile erneut versuchen, aber diesmal „uns“ als zweites Argument bestehen, werden Sie feststellen, dass die Ergebnisse wie zuvor sind:
<br> 020 7925 0918<br>
Sie können auch mit den Formaten herumspielen; All dies wird auch funktionieren:
<br> +44 20 7925 0918<br>
eine britische Zahl der Vereinigten Königreich zu interpretieren:
<br> 0044 20 7925 0918<br>
Dies gibt Folgendes aus:
<br> 011 44 20 7925 0918<br>
Sobald Sie eine Nummer analysiert haben, können Sie sie validieren - wie wir im nächsten Abschnitt sehen werden.
Validierung folgt einem ähnlichen Muster; Auch hier gibt es ein zweites optionales Argument, aber eines, das Sie benötigen, wenn das Land nicht implizit angegeben ist.
Hier sind einige Beispiele für gültige Zahlen, bei denen der Ländercode entweder als zweites Argument bereitgestellt oder innerhalb des ersten Arguments enthalten ist:
<br> +12024561111<br>
Wenn Sie den Ländercode nicht liefern oder nicht impliziert ist, erhalten Sie den gleichen Fehler wie zuvor:
<br> +442079250918<br>
Hier sind einige Beispiele, bei denen die Validierung fehlschlägt und falsch zurückgibt:
<span><span><span><input</span> type<span>="tel"</span> name<span>="number"</span>></span></span>
werden jedoch gewarnt, da eine ungültige Zahl eine Ausnahme ausgeben kann:
<span><!-- area code and number --> </span><span><span><span><input</span> type<span>="tel"</span> name<span>="number"</span>></span> </span><span><!-- country code, area code and number --> </span><span><span><span><input</span> type<span>="tel"</span> name<span>="country"</span> size<span>="4"</span>></span> <span><span><input</span> type<span>="tel"</span> name<span>="area"</span> size<span>="6"</span>></span> <span><span><input</span> type<span>="tel"</span> name<span>="number"</span> size<span>="8"</span>></span> </span><span><!-- US-style --> </span>(<span><span><span><input</span> type<span>="tel"</span> size<span>="3"</span>></span>) <span><span><input</span> type<span>="tel"</span> size<span>="3"</span>></span> - <span><span><input</span> type<span>="tel"</span> size<span>="4"</span>></span></span>
Manchmal ist es nützlich, den Typ einer Telefonnummer zu kennen. Zum Beispiel möchten Sie möglicherweise sicherstellen, dass Ihnen eine Mobiltelefonnummer erhalten wurde-möglicherweise planen Sie, SMS-Nachrichten zu senden, z.
Die GetNumberType () -Funktion der Bibliothek macht genau das. Schauen wir uns an.Die Funktion nimmt eine analysierte Telefonnummer als Argument an:
<span><span><span><input</span> type<span>="tel"</span> name<span>="number"</span> pattern<span>="^(?:\(\d{3}\)|\d{3})[- ]?\d{3}[- ]?\d{4}$"</span>></span></span>als Beispiel, lassen Sie uns abfragen, ob die betreffende Nummer ein Mobiltelefon oder eine feste Zeile ist:
<br> 202-456-1111<br>
wie das Thema des Themas zu sein scheint, gibt es natürlich einen Haken. Manchmal kann auch die Bibliothek für libphonenumme nicht sicher sein. US -Zahlen können beispielsweise nicht leicht zu unterscheiden; Daher die konstante pnt.fixed_line_or_mobile.
Wir müssen nur unseren Beispielcode ändern, um diese Unsicherheit widerzuspiegeln:
<br>
^(\([0-9]{3}\)|[0-9]{3}-)[0-9]{3}-[0-9]{4}$<br>Es gibt auch eine Reihe anderer Möglichkeiten. Hier ist die vollständige Liste derzeit:
Wie Sie sehen können, spiegelt der Pnt.unnown die Tatsache wider, dass wir nicht unbedingt Informationen mit proselligem Informationen sammeln können. Zusammenfassend lässt sich sagen, dass diese Funktion als schnelle Erstprüfung nützlich sein kann, aber wir können uns nicht darauf verlassen.
Es gibt viele Telefonnummern, die validieren, aber nicht verwendet werden. Sie wurden möglicherweise getrennt, noch nicht zugewiesen, oder vielleicht wurde eine SIM -Karte in eine Toilette fallen gelassen.
Wenn Sie sicherstellen müssen, dass eine Nummer nicht nur gültig, sondern auch aktiv ist, sind Ihnen eine Reihe von Optionen geöffnet.
Ein Ansatz besteht darin, die Nutzungsnummer zu erfordern, ihre Nummer auf die gleiche Weise zu bestätigen, wie es möglicherweise von Benutzern ihre E -Mail -Adresse bestätigt. Sie können einen Dienst wie Twilio verwenden, um eine SMS zu senden oder sogar einen Anruf zu tätigen.
Hier ist ein sehr einfacher Code -Snippet zum Generieren und Senden eines Bestätigungscodes per SMS mit Twilio:
<br> 202 456 1111<br> (202) 456 1111<br> 2024561111<br> 1-202-456-1111<br> 1-202-456-1111 x1234<br> 1-202-456-1111 ext1234<br> 1 (202) 456-1111<br> 1.202.456.1111<br> 1/202/456/1111<br> 12024561111<br> +1 202 456 1111<br>
Es ist dann eine triviale Übung, die Benutzer aufzufordern, den Code in ein Formular in Ihrer Web -App einzugeben, um ihn zu überprüfen - oder Sie könnten den Personen sogar erlauben, ihre Nummer zu validieren, indem Sie auf die Nachricht antworten.
Es gibt auch (bezahlte) Dienste, die prüfen, ob eine Nummer für Sie in Echtzeit in Betrieb ist, z. B. dieses von Byteplant.
Wie bei allen persönlichen Daten gibt es auch viele rechtliche Probleme, auf die man sich bewusst werden muss. In Großbritannien ist der Telefonpräferenzdienst (TPS) beispielsweise ein nationales Register von Telefonnummern, die explizit von Personen registriert wurden, die keine Marketingkommunikation erhalten möchten. Es gibt bezahlte Dienstleistungen, die APIs anbieten, um eine Nummer gegen dieses Register zu überprüfen, wie beispielsweise
.Es ist sehr üblich, bis zu drei verschiedene Telefonnummern in einer einzigen Form anzufordern. Zum Beispiel Tag, Abend und Mobile.
Es lohnt sich auch, sich daran zu erinnern, dass das Anfragen nach Telefonnummern über das Internet eher aufdringlich wirken kann. Wenn jemand nicht bereit ist, diese Informationen bereitzustellen, obwohl Sie es zu einem erforderlichen Feld gemacht haben, wird er wahrscheinlich eines von zwei Dingen tun:
Sie erinnern sich vielleicht, dass das JQuery -Plugin eine ziemlich kryptisch benannte Option namens UtilsScript hat.
Diese Option ermöglicht es uns, die Validierung und Formatierungsfunktionen von libphonennummer zu nutzen. Nachdem ein Land ausgewählt wurde-entweder mit der Dropdown-Verwendung oder durch Eingeben des Wählcode-wird das Textfeld in eine maskierte Eingabe umgewandelt, die das Nummerierungsformat dieses Landes widerspiegelt.
Das Plugin enthält eine verpackte Version von libphonenumber; Geben Sie den Pfad zu dieser Datei wie folgt an den Konstruktor weiter:
<br> 202-456-1111<br>
Wie bereits erwähnt, denken Sie daran, dass dieser Ansatz aufgrund der Dateigröße der Bibliothek libphonernummer mit Vorsicht verwendet werden sollte. Wenn Sie es hier im Konstruktor verweisen, bedeutet dies jedoch, dass es auf Bedarf geladen werden kann.
anzeigen
Wir haben uns untersucht, wie wir Zahlen formatieren können, wenn sie angezeigt werden, um „freundlicher“ zu sein, indem wir Formate wie PNF.International und PNF.National.verwenden können.
Wir können auch die TEL- und Callto -Protokolle verwenden, um Telefonnummern Hyperlinks hinzuzufügen, die auf mobilen Websites speziell nützlich sind. So können Benutzer eine Nummer direkt von einer Webseite wählen.
Um dies zu tun, brauchen wir das E.164 -Format für den Link selbst - zum Beispiel:
<br>
^(\([0-9]{3}\)|[0-9]{3}-)[0-9]{3}-[0-9]{4}$<br>
microdata
Wir können auch Mikrodaten verwenden, um Telefonnummern semantisch zu markieren. Hier ist ein Beispiel. Beachten Sie die Verwendung von itemProp = "Telefon", um den Link zu markieren:
<br> 202 456 1111<br> (202) 456 1111<br> 2024561111<br> 1-202-456-1111<br> 1-202-456-1111 x1234<br> 1-202-456-1111 ext1234<br> 1 (202) 456-1111<br> 1.202.456.1111<br> 1/202/456/1111<br> 12024561111<br> +1 202 456 1111<br>
Zusammenfassung
In diesem Artikel haben wir das Hornissennest geöffnet, das Telefonnummern ist. Es sollte inzwischen ziemlich offensichtlich sein, dass es alle möglichen Komplexitäten, Feinheiten und Gotchas gibt, die Sie sich bewusst sein müssen, wenn Sie sie sammeln, validieren und anzeigen müssen.
Wir haben uns einige Methoden zum Sammeln von Zahlen angesehen-den Eingangstyp „Tel“, maskierte Eingänge und schließlich das Intl-Tel-Input-JQuery-Plugin.
Wir haben uns dann einige der Probleme um die Validierung angesehen und warum gemeinsame Ansätze wie reguläre Ausdrücke oft unzureichend sind, insbesondere wenn Sie international werden.
Wir haben uns die Bibliothek von Google angesehen. Verwenden Sie es, um den Typ der Telefonnummern zu analysieren, zu validieren, anzeigen und zu bestimmen.
Wir haben das intl-tel-Input-Plugin mit libphonenumber für ein noch besseres Benutzererlebnis kombiniert, wenn auch eine Kosten in Bezug auf die Leistung.
Schließlich haben wir uns angesehen, wie wir Telefonnummern in unserer HTML markieren könnten.Es gibt einige Empfehlungen, die ich für den Umgang mit Telefonnummern machen würde:
Das obige ist der detaillierte Inhalt vonArbeiten mit Telefonnummern in JavaScript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
Ist es legal, Bitcoin auf Huobi.com zu kaufen und zu verkaufen?
So überprüfen Sie den Download-Verlauf auf TikTok
Kernelpanic-Lösung
Konfigurieren Sie die Java-Laufzeitumgebung
regulärer Perl-Ausdruck
So lösen Sie Probleme beim Parsen von Paketen
So beheben Sie einen Skriptfehler
So funktioniert der TCP-Drei-Wege-Handshake
![[Web-Frontend] Node.js-Schnellstart](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
