Heim > Web-Frontend > CSS-Tutorial > Hauptteil

Ausführliche Erläuterung der Unterschiede zwischen schreibgeschützt, deaktiviert, angezeigt und sichtbar

小云云
Freigeben: 2017-12-04 13:16:15
Original
2618 Leute haben es durchsucht

In diesem Artikel wird hauptsächlich die detaillierte Erläuterung der Unterschiede zwischen schreibgeschützt, deaktiviert, angezeigt und sichtbar vorgestellt. Es gibt mehrere Eigenschaften in den CSS-Stileinstellungen, die dieselbe Funktion, aber leicht unterschiedliche Ausdrucksformen haben. Als ich heute die Stileigenschaften des Objekts über js änderte, stellte ich fest, dass Anzeige und Sichtbarkeit gleich zu sein scheinen, aber tatsächlich gibt es sie Übrigens teilen Sie hier auch den Unterschied zwischen schreibgeschützt und deaktiviert, den Sie sehen.

Der Unterschied zwischen „display“ und „visible“:

(1) Als Erstes muss erklärt werden, dass sowohl „display:none“ als auch „visible:hidden“ ein Element auf der Webseite verbergen können.

(2) Wenn Sie display:none direkt verwenden, um ein Element im Stildatei- oder Seitendateicode auszublenden, verwenden Sie nach dem Laden der Seite den js-Code, ohne den Stil über js festzulegen, um das Element anzuzeigen B. offSetTop, offSetLeft usw., und der zurückgegebene Wert ist 0. Diese Werte können nur korrekt abgerufen werden, nachdem style.display in js festgelegt wurde, um das Element anzuzeigen.

(3) Mit display:none ausgeblendete Elemente werden von Suchseiten wie Baidu nicht abgerufen, was sich auf die SEO der Website auswirkt. In einigen Fällen kann left:-100000px verwendet werden, um dasselbe zu erreichen Wirkung.

(4) Wenn der display:none-Stil eines Elements über eine Stildatei oder festgelegt wird, führt das Festlegen von style.display="" mit js nicht dazu, dass das Element angezeigt wird angezeigt werden. Sie können stattdessen Werte wie Block oder Inline verwenden. Bei Einstellungen direkt am Element über style="display:none" tritt dieses Problem nicht auf.

(5) Wenn Sie das Element auf „display:none“ setzen, wird sein physischer Platz nicht für das ausgeblendete Objekt reserviert, das heißt, das Objekt verschwindet vollständig auf der Seite. Laienhaft ausgedrückt kann es weder gesehen noch berührt werden. Wenn Sie das Element auf „visibility:hidden“ setzen, wird das Objekt nur auf der Webseite unsichtbar, aber der Platz, den das Objekt auf der Webseite einnimmt, ändert sich nicht. Laienhaft ausgedrückt ist es unsichtbar, aber berührbar.

Der Unterschied zwischen schreibgeschützt und deaktiviert:

(1) Sowohl schreibgeschützt als auch deaktiviert können Benutzer daran hindern, den Inhalt in Formularfeldern zu ändern.

(2) Wenn sowohl das Attribut „disabled“ als auch das Attribut „readonly“ auf „true“ gesetzt sind, kann das Formularattribut nicht bearbeitet werden.

(3) Wenn die Deaktivierung eines Eingabeelements auf „True“ gesetzt ist, kann das Formulareingabeelement den Fokus nicht erhalten und alle Benutzervorgänge (Mausklicks und Tastatureingaben usw.) sind für das Eingabeelement ungültig. Schreibgeschützt gilt nur für Eingabeelemente wie Texteingabefelder, die Text eingeben können. Wenn der Wert auf „true“ gesetzt ist, kann der Benutzer den entsprechenden Text einfach nicht bearbeiten, kann sich aber trotzdem konzentrieren.

(4) „Readonly“ ist nur für die Eingabe (Text/Passwort) und den Textbereich gültig, während „Disabled“ für alle Formularelemente in HTML gültig ist, aber nachdem das Formularelement „Disabled“ verwendet, wenn wir das Formular nach dem Absenden über posten GET oder GET, der Wert dieses Elements wird nicht übermittelt, der Wert des auf „readonly“ gesetzten Formularelements wird jedoch weiterhin übermittelt. Die am häufigsten verwendeten Situationen sind:

(1) Ein eindeutiger Identifikationscode ist in einem Formular für den Benutzer vorab ausgefüllt und der Benutzer darf ihn nicht ändern, aber der Wert muss beim Absenden übergeben werden Zu diesem Zeitpunkt sollte das Attribut auf „schreibgeschützt“ gesetzt sein.

(2) Es kommt häufig vor, dass ein Benutzer beim formellen Absenden eines Formulars auf die Überprüfung der Informationen durch den Administrator warten muss. Dadurch kann der Benutzer die Daten im Formular jedoch nicht ändern Aufgrund des deaktivierten Elements kann es nur angezeigt werden Der Bereich ist groß, daher sollte zu diesem Zeitpunkt deaktiviert werden. Gleichzeitig sollte jedoch beachtet werden, dass die Schaltfläche „Senden“ ebenfalls deaktiviert sein sollte, andernfalls solange der Benutzer drückt Mit dieser Schaltfläche wird der Wert in der Datenbank gelöscht, wenn auf der Datenbankoperationsseite keine Integritätsprüfung erfolgt. Wenn in diesem Fall „readonly“ anstelle von „disabled“ verwendet wird, ist dies immer noch möglich, wenn das Formular nur Eingabeelemente (Text/Passwort) und Textbereichselemente enthält. Wenn andere Elemente wie „select“ vorhanden sind, kann der Benutzer den Wert neu schreiben und drücken Drücken Sie zum Absenden die Eingabetaste (Eingabetaste ist die standardmäßige Auslösetaste für das Senden).

(3) Wir verwenden häufig JavaScript, um die Schaltfläche „Senden“ zu deaktivieren, nachdem der Benutzer in einer Umgebung mit schlechten Netzwerkbedingungen wiederholt auf die Schaltfläche „Senden“ geklickt hat, was zu einer redundanten Datenspeicherung führt . Datenbank.

Der obige Inhalt ist eine detaillierte Erklärung der Unterschiede zwischen schreibgeschützt, deaktiviert, angezeigt und sichtbar. Ich hoffe, dass er für alle hilfreich ist.

Verwandte Empfehlungen:

Detaillierte Erläuterung der subtilen Unterschiede zwischen schreibgeschützt und deaktiviert

Eine kurze Diskussion der schreibgeschützten Eingabeattribute schreibgeschützt und deaktivieren in HTML Der Unterschied

Detaillierte Erklärung des Unterschieds zwischen den Anzeige- und Sichtbarkeitsattributen in div

Das obige ist der detaillierte Inhalt vonAusführliche Erläuterung der Unterschiede zwischen schreibgeschützt, deaktiviert, angezeigt und sichtbar. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage