it-swarm.com.de

Zählung der automatischen Telefonnummer in Windows 10 Edge-Browser

Der Edge-Browser von Windows 10 scheint Telefonnummern zu erkennen, auch wenn auf dem System keine Telefon-App installiert ist.

Es formatiert die Telefonnummer in Blau mit einer Unterstreichung, auch wenn sie irgendwo im Klartext ist (hässlich auf einigen Hintergründen). Außerdem erkennt sie z. Umsatzsteuer-Nummern, als wären es Telefonnummern.

Wie kontrollieren wir es als Webmaster, um:

  • wie wird das erkannte Material gerendert? (Ich nehme an, MSFT hat einen eigenen CSS-Selector für dieses Material entwickelt?) 

  • wie schalten wir die Erkennung aus? 

Vorzugsweise mit etwas, das nur auf diesen Browser abzielt, und nicht riskieren, dass andere Dinge durcheinander gebracht werden oder dass ansonsten gültiger Code Nicht-Standard-Elemente hinzugefügt wird.

BEARBEITEN:

  • Die vorgeschlagene Methode zum Deaktivieren der Erkennung basierend auf der Art und Weise, wie sie im IE11 für Windows-Telefone durchgeführt wird, funktioniert nicht in allen meinen Tests. Das Meta-Tag schlägt fehl und das nicht standardmäßige HTML-Attribut scheint zu funktionieren.

  • Ich habe mir das inspect-Ding in Edge angesehen und es scheint mir, dass das berechnete CSS für diese erkannten Elemente das ist, was man dort erwarten würde, wenn es nicht erkannt würde (dh das berechnete CSS hat die normale Farbe und keine Unterstreichung) geringe Chance zu kontrollieren, wie es gerendert wird.

BEARBEITEN:

testfall 1: Meta-Tag (schlägt fehl)

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  <head>
    <meta charset="UTF-8" />
    <!-- test -->
    <meta name="format-detection" content="telephone=no" />
  </head>
  <body>
    <p>text VAT BE 0123.456.789 text </p>
    <p>text +32 11 222 333 text</p>
  </body>
</html>

Testfall 2: Nicht-Standard-HTML-Attribut (Works)

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  <head>
    <meta charset="UTF-8" />
  </head>
  <body>
    <p x-ms-format-detection="none">text VAT BE 0123.456.789 text </p>
    <p>text +32 11 222 333 text</p>
  </body>
</html>

28
user3277192

Offenbar wurde die Telefonnummernerkennung in Internet Explorer 11 eingeführt, nicht jedoch auf Desktops.

Es gibt folgende Möglichkeiten, um es aus diesem MS-Artikel zu steuern: Erkennung des Telefonnummernformats

  • Setzen Sie das x-ms-format-detection-Attribut auf "none", um das Verhalten für ein Element (und seine untergeordneten Elemente) zu deaktivieren.
  • Um das Verhalten für eine Webseite zu deaktivieren, verwenden Sie das Meta-Element: 

<meta name="format-detection" content="telephone=no"/>

  • Um das Verhalten für ein Element (und seine untergeordneten Elemente) zu aktivieren, setzen Sie das x-ms-format-detection-Attribut auf "phone" oder "all".

  • Um das Verhalten mithilfe von JavaScript gezielt zu steuern, verwenden Sie setAttribute, um den Wert des x-ms-format-detection-Attributs des assoziierten Elements oder seines übergeordneten Elements zu ändern. (Beachten Sie, dass dies geschehen muss, bevor das Element oder das übergeordnete Element im DOM gerendert wird; dynamische Änderungen werden nicht unterstützt.)

Wenn ich den Artikel richtig verstanden habe und die Telefonerkennung auf Browserebene deaktiviert ist, wird das x-ms-format-detection-Attribut (oder das Meta-Tag) ignoriert.

27
jfrej

Die Verwendung des x-ms-format-detection="none" hat für mich funktioniert. Ich musste es jedoch dem übergeordneten Element hinzufügen.

Zum Beispiel wurde meine Telefonnummer in eine spanische Klasse eingepackt, so dass ich sie oben in das übergeordnete div einfügen musste. Durch das direkte Hinzufügen zum span-Tag wurde das Problem in Edge für mich nicht behoben. 

Hoffentlich hilft das

5
MikeBurgess

Ich habe einen Weg gefunden, der perfekt für mich funktioniert, und er besteht darin, den Tag zu ändern, bei dem Sie die Nummer durch ein "a" (Anker) anstelle eines beliebigen Wertes haben, ohne dass Sie href benötigen. Setzen Sie dann den Text unterstrichen auf none und die Farbe, die Sie übernehmen möchten. Das ist alles.

1
Jordi

Wenn Sie dem Body-Tag x-ms-format-detection = "none" hinzufügen, wird es auf die gesamte Seite angewendet.

<body x-ms-format-detection="none">
0
zefram

Dies sollte ein Kommentar sein, aber ich habe den Ruf noch nicht, sorry!

Aufbauend auf der vorherigen Antwort von jfrej und dem anschließenden Kommentar von Ben Hillier möchte ich darauf hinweisen, dass x-ms-format-detection="none" an einem span-Element arbeiten kann, jedoch nicht mit dem Standard display: inline, sondern eher mit display: inline-block.

Die Verwendung von <div x-ms-format-detection="none" style="display: inline">1234567890</div> funktioniert ebenfalls nicht.

0
PMCS