Analyse und Lösung der Ursache für den Verlust des Webseitenstils durch das automatische Ausfüllen von Formularen durch den Browser
|
Vom Backend zum Frontend: was für eine Tragödie. Als ich das CSS einer anderen Person in meine JSP-Webseite integrierte, trat ein seltsames Phänomen auf. Die Gegenpartei hat mir eine HTML-Datei bereitgestellt und nach dem Öffnen war der angezeigte Stil normal. Anschließend habe ich den Code in meine JSP-Seite kopiert und es trat ein seltsames Phänomen auf. Dies ist eine Anmeldeseite mit einem Eingabefeld für den Benutzernamen und einem Eingabefeld für das Passwort. Stellen Sie die Webseite auf dem Webserver bereit und öffnen Sie sie über den Browser. Sie stellen fest, dass die Stile der beiden Eingabefelder verloren gegangen sind. Der Stil kann nur dann normal angezeigt werden, wenn die Namensattribute der beiden Eingabefelder auf denselben Namen eingestellt sind. Ich habe mit dem Chrome-Plugin nachgeschaut und festgestellt, dass entsprechende Styles vorhanden sind, diese bei der Anzeige im Browser allerdings ungültig sind und durch die Styles ersetzt werden, die mit WebKit mitgeliefert werden. Es ist jedoch kein Problem, es mit der gleichen Browserversion auf anderen Computern zu öffnen. Schließlich half mir ein Kollege, der sich mit Webentwicklung auskannte, den Grund zu finden. Es lag daran, dass ich den Benutzernamen und das Passwort dieser Anmeldeseite im Browser gespeichert hatte, als ich sie auf meinem lokalen Computer testete. Als ich diese Seite öffnete, füllte Chrome den Benutzernamen und das Passwort automatisch aus und ersetzte den Webseitenstil durch den Standardstil von WebKit, bei dem es sich um ein Eingabefeld mit gelbem Hintergrund handelt, um den Benutzer darauf hinzuweisen, dass dies der automatisch ausgefüllte Formularinhalt ist. Löschen Sie einfach den von Chrome gespeicherten Benutzernamen und das Passwort dieser Webseite. |
<<: CSS-Beispielcode zum Erzielen eines kreisförmigen Fortschrittsbalkeneffekts mit Farbverlauf
>>: Interpretation und Verwendung verschiedener React-State-Manager
Artikel empfehlen
Ich habe einige Websites zum Thema Wohndesign herausgesucht, die ich für gut halte.
<br />Ich habe einige Websites zum Thema Woh...
Eine Fallstudie zum gründlichen Verständnis der korrekten Verwendung des MySQL-InnDB-Joint-Index
Es gibt ein Unternehmen, das die 5 zuletzt überpr...
Detaillierte Erklärung der Beziehung zwischen Vue und VueComponent
Der folgende Fall überprüft die Wissenspunkte der...
So überwachen Sie Array-Änderungen in JavaScript
Vorwort Als ich zuvor „defineProperty“ vorgestell...
Detaillierte Erläuterung des Beispielcodes für das elastische CSS3 Flex-Layout
1. Grundlegende Konzepte //Jeder Container kann a...
Zusammenfassung der bei der Arbeit häufig verwendeten Linux-Befehle
Verwenden Sie bei der Arbeit mehr Open-Source-Too...
Detaillierte Erklärung von BOM und DOM in JavaScript
Inhaltsverzeichnis BOM (Browserobjektmodell) 1. F...
Beispielcode zum Erstellen eines Admin-Dashboard-Layouts mit CSS und JavaScript
Was Sie erstellen werden In diesem neuen Tutorial...
Verwenden Sie Prometheus, um den verbleibenden verfügbaren Prozentsatz der MySQL-Autoinkrement-Primärschlüssel zu zählen
Vor kurzem hat eine Datenbank in der Produktionsu...
Detaillierte Erklärung zum Erstellen eines Arrays in JavaScript
Inhaltsverzeichnis Erstellen von Arrays in JavaSc...
So optimieren Sie die langsame Like-Fuzzy-Abfrage in MySQL
Inhaltsverzeichnis 1. Einleitung: 2. Die erste Id...
So löschen Sie eine MySQL-Tabelle
Das Löschen einer Tabelle in MySQL ist sehr einfa...
Detaillierte Erläuterung der Gründe und Lösungen für den Fehler beim normalen Start von Docker
1. Abnormale Leistung beim Docker-Start: 1. Der S...
Detaillierte Erläuterung der passwortfreien SSH-Anmeldekonfigurationsmethode (Bilder und Befehle)
Lassen Sie mich zunächst erklären, dass wir uns o...
Mobile Frontend-Anpassungslösung (Zusammenfassung)
Ich habe online gesucht und festgestellt, dass in...