[javascript] Tekst inputfield weg na plaatsen cursor

[Verwijderd]

Ik heb een klein loginform gemaakt waarbij IN de twee inputfields staat wat er ingevuld moet worden. In de bovenste staat dus 'gebruikersnaam' en in de onderste 'wachtwoord'.
Nu wil ik graag dat wanneer een gebruiker zijn cursor plaatst in één van de fields, het betreffende field wordt gewist, zodat men de gegevens kan invoeren.

Hoe kan ik dit voor elkaar krijgen? Het lijkt me dat dat met javascript kan? En zo ja, wie heeft er een beetje code over?

[ThunderNet]

met onclick event? Maar hier zijn genoeg voorbeelden van te vinden

[Verwijderd]

ThunderNet schreef op donderdag 18 oktober 2007 @ 09:10:
met onclick event? Maar hier zijn genoeg voorbeelden van te vinden

ja, en die zoek ik dus Weet het ff niet goed te bewoorden, kan het daarom niet vinden

[Hoicks]

Ik denk dat je dit bedoelt:

code:

<input type="text" name="naam" value="Username" onClick="this.value=''">

Bij input type wachtwoord kan dit niet. Aangezien wachtwoord dan als sterretjes wordt weergegeven.

[ Voor 41% gewijzigd door Hoicks op 18-10-2007 09:21 ]

[Zamalan]

HTML:

<input type="text" value="gebruikersnaam" onclick="this.value = '';" />

of properder:

HTML:

<script>
function clearField()
{
  if(this.value == "gebruikersnaam")
  {
    this.value = "";
  }
}
</script>
<input type="text" value="gebruikersnaam" onclick="clearField()" />

De eerste cleared altijd wanneer er geklikt werd. Het tweede enkel als er "gebruikersnaam" ingevuld werd.

[moozzuzz]

zoek-keywords:
onFocus en this.value

Je kan ook op tweakers zien (zoekbox). (bron weergeven)

[ Voor 0% gewijzigd door moozzuzz op 18-10-2007 09:24 . Reden: too late :-) ]

[Verwijderd]

Thnx, dit gaat er op lijken!

Ik ga even knutselen.

[Verwijderd]

Zamalan schreef op donderdag 18 oktober 2007 @ 09:20:

HTML:

<input type="text" value="gebruikersnaam" onclick="this.value = '';" />

of properder:

HTML:

<script>
function clearField()
{
  if(this.value == "gebruikersnaam")
  {
    this.value = "";
  }
}
</script>
<input type="text" value="gebruikersnaam" onclick="clearField()" />

De eerste cleared altijd wanneer er geklikt werd. Het tweede enkel als er "gebruikersnaam" ingevuld werd.

dit werkt iig niet...

[Verwijderd]

moozzuzz schreef op donderdag 18 oktober 2007 @ 09:23:
zoek-keywords:
onFocus en this.value

Je kan ook op tweakers zien (zoekbox). (bron weergeven)

Met de code van de tweakerssite lukt het wel

Nu nog even kijken of het ook goed gaat met het ww.

[Zamalan]

Verwijderd schreef op donderdag 18 oktober 2007 @ 09:37:
[...]

dit werkt iig niet...

Vreemd... Als iemand me kan uitleggen waarom niet. "this" is de aanroeper en dat zou moeten de input zijn.

net getest en dit werkt wel:

HTML:

<script>
function clearField(element)
{
 
  if(element.value == "gebruikersnaam")
  {
    element.value = "";
  }
}
</script>
<input type="text" value="gebruikersnaam" onclick="clearField(this)" />

edit op tweakers staat dit:

HTML:

<input type="text" onfocus="this.value=='Zoeken...'?this.value='':this.select()" value="Zoeken..." name="keyword" class="text"/>

[ Voor 14% gewijzigd door Zamalan op 18-10-2007 09:45 ]

[ThunderNet]

Zamalan schreef op donderdag 18 oktober 2007 @ 09:43:
[...]

Vreemd... Als iemand me kan uitleggen waarom niet. "this" is de aanroeper en dat zou moeten de input zijn.

net getest en dit werkt wel:

HTML:

<script>
function clearField(element)
{
 
  if(element.value == "gebruikersnaam")
  {
    element.value = "";
  }
}
</script>
<input type="text" value="gebruikersnaam" onclick="clearField(this)" />

edit op tweakers staat dit:

HTML:

<input type="text" onfocus="this.value=='Zoeken...'?this.value='':this.select()" value="Zoeken..." name="keyword" class="text"/>

This heeft wel een id nodig denk ik? Dus zodra je een id geeft aan je inputbox

[Zamalan]

ThunderNet schreef op donderdag 18 oktober 2007 @ 09:46:
[...]

This heeft wel een id nodig denk ik? Dus zodra je een id geeft aan je inputbox

Firebug geeft aan dat binnen de functie "this" de window is . Ook al is de id gezet.

[ Voor 4% gewijzigd door Zamalan op 18-10-2007 09:50 ]

[Crayne]

Hint: scope.

[BtM909]

Tweakers heeft een mooi voorbeeld en betrouwbare bronnen hebben mij verteld dat Google nog veeeeeeel meer werkende voorbeelden in z'n archief heeft

Voor scriptrequests is GoT niet de juiste plaats, maar dat moge duidelijk zijn. Zo niet, dan is dit goed leesvoer: Webdesign, Markup & Clientside Scripting Policy