Kürzlich habe ich eine in die Miniprogramm-Webansicht eingebettete H5-Seite geschrieben, die eine Funktion von Artikelkommentaren ist. Dabei bin ich auf viele Kompatibilitätsprobleme gestoßen, und die Leistung auf verschiedenen Modellen war ebenfalls sehr inkonsistent, daher habe ich die folgenden Probleme zusammengefasst : Nehmen Sie es auf, damit Sie es später überprüfen können
1. DatumsproblemFür jjjj-mm-tt hh:mm:ss wird dieses Format vom iOS-System nicht erkannt
Wenn die Zeit formatiert ist, wird sie auf der Browserseite gut verarbeitet, auf dem Mobiltelefon wird sie jedoch zu NAN oder Null. In diesem Fall kann das iOS-System diese Art von Zeit nicht konvertieren.
let date = new Date('2019-02-28 18:33:24'); // null`Die Lösung besteht darin, es in das Format jjjj/mm/tt hh:mm:ss zu konvertieren.
ersetzen(//-/g, /)2. Die Tastatur wird weggelegt und die Seite bleibt hängen und kehrt nicht zurück.
Unter ios12 habe ich festgestellt, dass die Seite beim Einziehen der Tastatur hängen bleibt und der untere Teil leer bleibt. Wenn Sie die Seite leicht verschieben, wird sie wiederhergestellt.
Für diese Art von Problem habe ich viele Lösungen im Internet überprüft. Die Lösung besteht grob darin, während des Unschärfeereignisses durch die Seite zu scrollen.
window.scrollTo(0, scroll);
Es gibt jedoch ein sehr ernstes Problem: Wenn auf der Seite Schaltflächen vorhanden sind, die bedient werden müssen, z. B. ein Kommentareingabefeld + eine Schaltfläche zum Veröffentlichen, klicken Sie nach der Eingabe des Textes auf „Veröffentlichen“, und wenn das Klickereignis ausgelöst wird, wird die Seite geöffnet löst zuerst das Unschärfeereignis aus und die Tastatur fällt zurück. Dann war es vorbei. . . . Das Klicken auf die Schaltfläche bewirkt nichts.
Lösung: Durch Ändern des Click-Ereignisses in „ontouchstart“ kann dieses Problem gelöst werden. Das Ontouchstart-Ereignis ist besser als das Auslösen von Klickereignissen
3. In der Webansicht des WeChat-Applets in ios12 ist die Tastatur eingefahren und der untere Rand der Seite ist leer.Es wird vermutet, dass dieses Problem durch die automatische Bildlaufeinstellung der Seite verursacht wird.
4. Der iPhone-Fix schlägt fehl, was dazu führt, dass sich der Textbereichscursor auf einigen Computern verschiebt.Lösung: Alle Geschwisterelemente werden absolut und das übergeordnete Element overflow:auto;
Übergeordnetes Element: Höhe: 100 Vh; padding-bottom: 10px; z-index: 15. Die Tastatur blockiert das Eingabefeld
Wenn das Eingabefeld unten mit „Fixed“ fixiert ist und die Tastatur angehoben wird, schlägt die Fixierung auf dem iPhone fehl, sodass die Seite mit der Seite gescrollt wird, und bei einigen Modellen auch das Eingabefeld Gelegentlich wird die Tastatur blockiert. Gelegentliche Probleme, sehr unfreundlich
Lösung: Geben Sie die Verwendung des festen Layouts auf. Wenn Sie gezwungen sind, das absolute Layout zu verwenden, lesen Sie bitte den vorherigen Artikel zum Cursor-Offset.
Es wird empfohlen, das Flex-Layout zu verwenden, da die Kompatibilität behoben wird.
Wenn Sie auf die oben genannten Probleme stoßen, bedeutet dies, dass das Produktdesign bei Bedarf dennoch in ein Design geändert werden muss, bei dem die Eingabe nicht durch die Tastatur nach oben verschoben werden muss sind nicht perfekt. Lösen Sie die Probleme aller Modelle.
Das Obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, dass er für das Studium aller hilfreich ist. Ich hoffe auch, dass jeder das VeVb Wulin Network unterstützt.