Slik deaktiverer Input tekst i HTML

Slik deaktiverer Input tekst i HTML


Forebygging av besøkende fra inn data på en nettside er ofte like viktig som å gi dem muligheten til å gjøre det. Nettsider består av HTML-elementer som tekstbokser og tekstområder. Når brukere legge inn data i disse kontrollene, kan nettleseren utføre en rekke oppgaver, inkludert å validere data og lagre den i en database. Det kan imidlertid oppstå situasjoner der brukerne ikke har myndighet til å oppdatere en HTML-element. Hindre noen fra å skrive inn tekst i noen kontroll ved å deaktivere kontrollen.

Bruksanvisning

1 Åpne Notisblokk og opprette et tomt dokument.

2 Lim inn følgende tekst i dokumentet:

<! DOCTYPE html PUBLIC "- // W3C // DTD XHTML 1.0 Transitional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<Html xmlns = "http://www.w3.org/1999/xhtml">

<Head>

<Title> Deaktiver -inntastingen Test </ title>

<Script language = "javascript" type = "text / javascript">

</ Script>

</ Head>

<Body>

<Input id = "textBox1" type = "text" />

<Input id = "btnDisable" type = "button" value = "Deaktiver Text" onclick = "return disableText ()" />

</ Body>

</ Html>

Dette skaper en tekstboks og en knapp.

3 Legg denne koden under den første "<script>" tag:

funksjon disableText () {

var currentObject = document.getElementById("textBox1");

currentObject.disabled = "deaktivert";

alert ( "Tekst Disabled");

}

Dette skaper en Javascript-funksjon som setter "funksjonshemmet" eiendom for tekstboksen kontrollen til "deaktivert". Når en bruker klikker på knappen, kaller knappen denne funksjonen. Bruk "document.getElementById" -kommandoen til å gjøre sideelementer, for eksempel "textBox1," tilgjengelig i en Javascript-funksjon. For eksempel, hvis siden inneholdt en annen tekstboks som heter "textBox2," du ville få en referanse til det ved å skrive denne uttalelsen:

Var currentObject2 = document.getElementById ( "textBox2");

4 Trykk "Ctrl" + "S." Notisblokk vil åpne "Lagre som" -vinduet. Skriv "abc.html" i "File Name" tekstboksen. Klikk på "Lagre". Notisblokk vil lagre filen som et HTML-dokument.

5 Åpne Windows Utforsker. Finn filen og dobbeltklikk på den. Nettleseren vil åpne den. Skriv tekst inn i tekstboksen. Klikk på knappen. Nettleseren vil deaktivere tekstboksen og hindre deg fra å skrive inn tekst.

Hint

  • Navn HTML-filer noe du liker. Kontroller at du gir filen en forlengelse av ".html" eller ".htm".
  • Hvis du vil aktivere en kontroll, endre "disabled" egenskapen til "aktivert".
  • Den "document.getElementById" -kommandoen er en viktig Javascript kommandoen for å lære (se Ressurser). Mange webutvikling teknikker bruke denne kommandoen for å legge til funksjonalitet til nettsteder.