Heim Web-Frontend HTML-Tutorial So machen Sie Textfelder wie Formulareingaben in HTML schreibgeschützt und nicht bearbeitbar

So machen Sie Textfelder wie Formulareingaben in HTML schreibgeschützt und nicht bearbeitbar

Jun 05, 2018 am 11:10 AM
input Nur lesen

Manchmal hoffen wir, dass das Textfeld im Formular schreibgeschützt ist, sodass der Benutzer die darin enthaltenen Informationen nicht ändern kann.

Manchmal kann der Inhalt des Eingabetexts nicht geändert werden. Wir hoffen, dass das Textfeld im Formular schreibgeschützt ist, sodass der Benutzer die darin enthaltenen Informationen nicht ändern kann. Wenn beispielsweise der Inhalt von geändert wird, kann das Wort „China“ nicht geändert werden. Zusammenfassend sind die Implementierungsmethoden wie folgt.

Methode 1: onfocus=this.blur() Fokus verlassen, wenn die Maus nicht platziert werden kann

<input type="text" name="input1" value="中国" onfocus=this.blur()>
Nach dem Login kopieren

Methode 2: schreibgeschützt

<input type="text" name="input1" value="中国" readonly> 
<input type="text" name="input1" value="中国" readonly="true">
Nach dem Login kopieren

Methode 3 : deaktiviert

<input type="text" name="input1" value="中国" disabled="true">
Nach dem Login kopieren

Vollständiges Beispiel:

<input name="ly_qq" type="text" tabindex="2" onMouseOver="this.className=&#39;input_1&#39;" onMouseOut="this.className=&#39;input_2&#39;" value="123456789" disabled="true" readOnly="true" />
Nach dem Login kopieren

disabled="true" Der Text wird grau und kann nicht bearbeitet werden.
readOnly="true"Der Text ändert seine Farbe nicht und kann nicht bearbeitet werden

CSS-Eingabeabschirmung:

Es gibt zwei Methoden: „disabled“ ist so definiert, dass das deaktivierte Eingabeelement weder verfügbar noch anklickbar ist. Zweitens: readonly="readonly" schreibgeschützte Felder können nicht geändert werden. Benutzer können jedoch weiterhin die Tabulatortaste verwenden, um zum Feld zu wechseln, und auch den Text auswählen oder kopieren.

Verwandte Empfehlungen:

HTML5-Video/Audio wird abgespielt lokale Dateien

Das obige ist der detaillierte Inhalt vonSo machen Sie Textfelder wie Formulareingaben in HTML schreibgeschützt und nicht bearbeitbar. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

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

Heiße KI -Werkzeuge

Undresser.AI Undress

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool

Undress AI Tool

Ausziehbilder kostenlos

Clothoff.io

Clothoff.io

KI-Kleiderentferner

AI Hentai Generator

AI Hentai Generator

Erstellen Sie kostenlos Ai Hentai.

Heißer Artikel

R.E.P.O. Energiekristalle erklärten und was sie tun (gelber Kristall)
2 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌
Repo: Wie man Teamkollegen wiederbelebt
4 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island Abenteuer: Wie man riesige Samen bekommt
4 Wochen vor By 尊渡假赌尊渡假赌尊渡假赌

Heiße Werkzeuge

Notepad++7.3.1

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version

SublimeText3 chinesische Version

Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1

Senden Sie Studio 13.0.1

Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6

Dreamweaver CS6

Visuelle Webentwicklungstools

SublimeText3 Mac-Version

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

So ändern Sie die Linux-fstab-Datei, um das schreibgeschützte Attribut aufzuheben So ändern Sie die Linux-fstab-Datei, um das schreibgeschützte Attribut aufzuheben Jan 15, 2024 pm 05:57 PM

Nach dem Experimentieren mit Mount-Optionen, um die Ausführung von Set-Bit-Programmen und Binärprogrammen zu verhindern, [root@localhost~]#vi/etc/fstab/# nach dem Hinzufügen von /dev/sdc1/varext3defaults,noexec12[root@localhost~]#mount-oremount /var Nach dem Neustart des Systems wurde festgestellt, dass /dev/sdc1 nicht eingegeben werden kann und nur die Zeichenschnittstelle eingegeben werden kann. Ich möchte diese Zeile löschen, aber beim Speichern der Datei wird das schreibgeschützte Attribut Read-onlyfilesystem angezeigt. Ich habe versucht, (1) chmod+w/etc/fstab (2):w zu verwenden. nur und kann nicht geändert werden.

Praktischer Leitfaden: Implementieren von schreibgeschützten Berechtigungen auf Tabellenebene in Oracle Praktischer Leitfaden: Implementieren von schreibgeschützten Berechtigungen auf Tabellenebene in Oracle Mar 06, 2024 pm 05:09 PM

Das Implementieren von Leseberechtigungen auf Tabellenebene in Oracle ist ein häufiger und wichtiger Vorgang in der Datenbankverwaltung. Durch das Festlegen schreibgeschützter Berechtigungen können Sie sicherstellen, dass einige Benutzer Tabellendaten nur abfragen, aber nicht ändern können, wodurch die Integrität und Sicherheit der Daten wirksam geschützt wird. Im Folgenden wird detailliert beschrieben, wie schreibgeschützte Berechtigungen auf Tabellenebene in Oracle implementiert werden, sowie spezifische Codebeispiele. Schritt 1: Erstellen Sie eine Tabelle. Erstellen Sie zunächst eine Beispieltabelle in Oracle, um zu demonstrieren, wie Sie schreibgeschützte Berechtigungen auf Tabellenebene festlegen. Angenommen, wir erstellen eine Datei namens „exampl

So implementieren Sie ein verstecktes Laravel-Eingabefeld So implementieren Sie ein verstecktes Laravel-Eingabefeld Dec 12, 2022 am 10:07 AM

So implementieren Sie das ausgeblendete Laravel-Eingabefeld: 1. Suchen und öffnen Sie die Blade-Vorlagendatei. 2. Verwenden Sie die method_field-Methode in der Blade-Vorlage, um ein ausgeblendetes Feld zu erstellen. ".

So kapseln Sie Eingabekomponenten und einheitliche Formulardaten in vue3 So kapseln Sie Eingabekomponenten und einheitliche Formulardaten in vue3 May 12, 2023 pm 03:58 PM

Vorbereitung Verwenden Sie vuecreateexample, um ein Projekt zu erstellen. Die Parameter lauten ungefähr wie folgt: Verwenden Sie native Eingaben, bei denen es sich hauptsächlich um Werte und Änderungen handelt. App.tsx lautet wie folgt: import{ref}from'vue';exportdefault{setup(){//username is the data constusername=ref('Zhang San');//Wenn sich das Eingabefeld ändert, synchronisieren Sie die Daten constonInput =;return( )=>({

So stellen Sie die Festplatte mit dem Partitionstool diskgenius als schreibgeschützt ein - So stellen Sie die Festplatte mit diskgenius als schreibgeschützt ein So stellen Sie die Festplatte mit dem Partitionstool diskgenius als schreibgeschützt ein - So stellen Sie die Festplatte mit diskgenius als schreibgeschützt ein Mar 04, 2024 pm 03:00 PM

Freunde, wissen Sie, wie man die Festplatte mit dem Partitionstool diskgenius auf schreibgeschützt setzt? Wenn Sie interessiert sind, schauen Sie sich das an der Herausgeber. Ich hoffe, es kann Ihnen helfen. Schritt 1: Öffnen Sie zunächst die DiskGenius-Software und wählen Sie die Festplatte aus, die eingestellt werden muss. Schritt 2: Zweitens öffnen Sie in der DiskGenius-Software das Festplattenmenü. Schritt 3: Ändern Sie erneut, wie in der Abbildung gezeigt, den Status dieser Festplatte in „schreibgeschützt“. Schritt 4: Bestätigen Sie abschließend diesen Vorgang, um die Festplatte schreibgeschützt zu machen.

Detaillierte Erläuterung der Eingabefeld-Bindungsereignisse in Vue-Dokumenten Detaillierte Erläuterung der Eingabefeld-Bindungsereignisse in Vue-Dokumenten Jun 21, 2023 am 08:12 AM

Vue.js ist ein leichtes JavaScript-Framework, das einfach zu verwenden, effizient und flexibel ist. Es ist derzeit eines der beliebtesten Front-End-Frameworks. In Vue.js sind Eingabefeld-Bindungsereignisse eine sehr häufige Anforderung. In diesem Artikel werden die Eingabefeld-Bindungsereignisse im Vue-Dokument ausführlich vorgestellt. 1. Grundkonzepte In Vue.js bezieht sich das Eingabefeld-Bindungsereignis auf die Bindung des Werts des Eingabefelds an das Datenobjekt der Vue-Instanz, wodurch eine bidirektionale Bindung von Eingabe und Antwort erreicht wird. In Vue.j

Was tun, wenn beim Klicken auf das Eingabefeld kein Cursor angezeigt wird? Was tun, wenn beim Klicken auf das Eingabefeld kein Cursor angezeigt wird? Nov 24, 2023 am 09:44 AM

Lösungen zum Anklicken des Eingabefelds ohne Cursor: 1. Bestätigen Sie den Browser-Cache. 3. Aktualisieren Sie den Browser. 6. Überprüfen Sie die Eingabe Box-Eigenschaften; 7. Debuggen von JavaScript-Code; 8. Überprüfen Sie andere Elemente der Seite. 9. Berücksichtigen Sie die Browserkompatibilität.

So verwenden Sie das Wagenrücklauf-Ereignis und die Überprüfungsfunktion des Eingabefelds im Vue-Dokument So verwenden Sie das Wagenrücklauf-Ereignis und die Überprüfungsfunktion des Eingabefelds im Vue-Dokument Jun 20, 2023 am 09:13 AM

Vue ist ein beliebtes JavaScript-Frontend-Framework mit einem reaktionsfähigen Datenbindungs- und Komponentensystem im Kern. In Vue-Anwendungen ist das Eingabefeld eines der am häufigsten verwendeten UI-Elemente. Wenn der Benutzer Text eingibt, hoffen wir, auf das Wagenrücklaufereignis zu warten und die Eingabe vor dem Absenden zu validieren. In diesem Artikel werden das Eingabeereignis des Eingabefelds und die Verwendung der Überprüfungsfunktion im Vue-Dokument vorgestellt. 1. Das Wagenrücklaufereignis des Eingabefelds in Vue ist sehr einfach.

See all articles