Gå til innhold

Hvordan tømme felter i skjema når de trykkes på?

G2Petter

Anbefalte innlegg

G2Petter

G2Petter

Skrevet
Skrevet (endret)

Jeg har et skjema som går omtrent som dette:

<form action="action.php" method="post">
   	<P><input type="text" name="mail" value="E-post"></p>
   	<p><input type="text" name="name" value="Navn"></p>
   	<p><input type="textarea" cols="20" rows="10" name="message" value="Din beskjed"></p>
   	<p><input type="text" name="tlf" value="Telefonnummer"></p>
   	<p><input type="submit" name="submit" value="Send"></p>
   </form>

 

Hvordan kan jeg enklest mulig gjøre det sånn at feltene tømmes når brukere trykker for å skrive inn verdiene sine?

 

Hilsen g2petter

Endret av G2Petter
Lenke til kommentar

Videoannonse

Videoannonse
Annonse
Kagee

Kagee

Skrevet
Skrevet (endret) 

<form action="action.php" method="post">
   <P><input type="text" name="mail" value="E-post" onFocus="if(this.value='E-post'){this.value=''}"></p>
   <p><input type="text" name="name" value="Navn" onFocus="if(this.value='Navn'){this.value=''}"></p>
   <p><textarea cols="20" rows="10" name="message" onFocus="if(this.innerHTML=''){this.innerHTML=''}">Din beskjed</textarea></p>
   <p><input type="text" name="tlf" value="Telefonnummer" onFocus="if(this.value='Telefonnummer'){this.value=''}"></p>
   <p><input type="submit" name="submit" value="Send"></p>
  </form>

 

onFocus reagerer både på tab og museklikk. Endra litt på textarea'n din.

Endret av Kagee
Lenke til kommentar
Kagee

Kagee

Skrevet
Skrevet (endret)

This Page Is Valid XHTML 1.0 Strict!

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
       "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
     <html xmlns="http://www.w3.org/1999/xhtml" lang="no" xml:lang="no">
<head>
<title>En form</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
</head>
<body>
<form action="action.php" method="post">
<p><input type="text" name="mail" value="E-post" onfocus="if(this.value=='E-post'){this.value=''}" /></p>
<p><input type="text" name="name" value="Navn" onfocus="if(this.value=='Navn'){this.value=''}" /></p>
<p><textarea cols="20" rows="10" name="message" onfocus="if(this.value=='Din beskjed'){this.value=''}">Din beskjed</textarea></p>
<p><input type="text" name="tlf" value="Telefonnummer" onfocus="if(this.value=='Telefonnummer'){this.value=''}" /></p>
<p><input type="submit" name="submit" value="Send" /></p>
</form>
</body>
</html>

 

Fiksa logiske brister (= -> ==) forandra taggen i textarea (kunne bruke value der også, opera støttet ikke bruken av innerHTML) og gjorde koden XHTML 1.0 Strict-gyldig. ( <input />, <P> -> <p>, onFocus -> onfocus m.m)

 

Hvis du nå lagrer denne som UTF-8, så gokjennes den av W3C.

Endret av Kagee
Lenke til kommentar
G2Petter

G2Petter

Skrevet
  • Forfatter
Skrevet

Flotte greier. Finnes det en "offocus"-mulighet også, sånn at man kan bruke f,eks 

offocus="if(this.value==''){this.value='Telefonnummer'}"

Sånn at den orginale verdien kommer tilbake hvis man har trykket inne i feltet, ikke skrevet noe, og så trykker utenfor igjen.

Lenke til kommentar

Opprett en konto eller logg inn for å kommentere

Du må være et medlem for å kunne skrive en kommentar

Opprett konto

Det er enkelt å melde seg inn for å starte en ny konto!

Start en konto

Logg inn

Har du allerede en konto? Logg inn her.

Logg inn nå
Gå til emneliste

  • Hvem er aktive   0 medlemmer

    • Ingen innloggede medlemmer aktive
×
×
  • Opprett ny...