Toni: Input "test" soll verschwinden lernen...

Hallo,

ich versuche auf biegen und brechen meine Internethomepage Behindertengerecht zu bekommen.
Nach viel Bastelei habe ich nun auch das AAA von http://webxact.watchfire.com/ bekommen.
Nun möchte ich es natürlich noch Halbwegs komfortabel für alle machen. Daher möchte ich in einem Input feld den vorgegebenen text (<input id="suche" type="text" name="q" size="9" maxlength="255" value="Neue Suche" ></input>
) beim draufklicken verschwinden lassen.
Dieses geht, nach dem was ich jetzt gelesen habe nur mit Java Script.
Nur wie??

Danke

Toni

PS: mein derzeitiger Code:

<form method="get" action="http://www.google.de/custom">

<p>

<input type="hidden" name="domains" value="stsboard.de;stshome.de"></input>
<label for="suche"></label>

<input id="suche" type="text" name="q" size="9" maxlength="255" value=" " ></input>

<input type="submit" name="sa" value="Finden"></input><br />

<input type="radio" name="sitesearch" value="meinehomepage.de"></input>

Meine Homepage

<br /><input type="radio" name="sitesearch" value="meinehomepage2.de" checked="checked"></input>

Meine Homepage

<input type="hidden" name="client" value="pub-"></input>

<input type="hidden" name="forid" value="1"></input>

<input type="hidden" name="ie" value="ISO-8859-1"></input>
<input type="hidden" name="oe" value="ISO-8859-1"></input>
<input type="hidden" name="cof" value="GALT:#008000;GL:1;DIV:#336699;VLC:663399;AH:center;BGC:FFFFFF;LBGC:336699;ALC:0000FF;LC:0000FF;T:000000;GFNT:0000FF;GIMP:0000FF;FORID:1;"></input>

<input type="hidden" name="hl" value="de"></input>

</p>

</form>

  1. Hi Toni,

    Du triggerst mit dem evetnhandler onFocus ein Funktion HideStdValue, die dann prueft, ob das feld den Standardwert enthaelt. Wenn das so ist, wird der Wert auf "" gesetzt. Der Code:

    <script language="javascript">
    function HideStdValue(field) {
      if (field.value == 'Neue Suche   ') {
        field.value   = '';
        field.onfocus = '';
        }
      }
    </script>

    ...
    <input id="suche" type="text" name="q" size="9" maxlength="255" value="Neue Suche   " onFocus="HideStdValue(this)"/>

    Anmerkung: Um das ganze wirklich idiotensicher zu machen solltest Du den value von "Neue Suche" in "Neue Suche   " aendern ;)

    Gruss,

    Lynky

    1. hi,

      Anmerkung: Um das ganze wirklich idiotensicher zu machen solltest Du den value von "Neue Suche" in "Neue Suche   " aendern ;)

      aus welchem grund?

      gruß,
      wahsaga

      --
      /voodoo.css:
      #GeorgeWBush { position:absolute; bottom:-6ft; }
      1. Servus,

        hi,

        Anmerkung: Um das ganze wirklich idiotensicher zu machen solltest Du den value von "Neue Suche" in "Neue Suche   " aendern ;)

        aus welchem grund?

        gruß,
        wahsaga

        Sollte jemand nach "Neue Suche" suchen wollen.... und dann wieder in das Feld klicken...

        Sehr praxisnahes Beispiel, da frage ich mich, WAS, wenn er nach "Neue Suche   " suchen will...

        mit freundlichen Grüßen,

        Andreas Kampitsch

        --
        SELFCode:ie:% fl:) br:> va:} ls:[ fo:) rl:( n4:# ss:| de:] js:| ch:? sh:( mo:) zu:|
        1. Hi

          Sehr praxisnahes Beispiel,

          *gg* du hast ja recht, ist eher ne generelle angelegenheit, ich hatte die gleiche geschichte bei einer myprofile page... und habe daraus gelernt. z.B.:
          Als abkuerzung fuer last name wird oftmals "last" verwendet -> kann auch ein name sein.

          da frage ich mich, WAS, wenn er nach "Neue Suche   " suchen will...

          dann ist ihm auch nimmer zu helfen :D

          Gruss,

          Lynky

    2. Hallo,

      vielen Dank im "standart HTML" Format klappt es nun SUPER. Aber wie verwende ich es innerhalb des PHP?
      Denn die '; sind ja sogesehen Schlusszeichen für PHP bzw. für den Echo Befehl? Ich habe irgendwie im Hinterkopf das man den Inhalt ausklammern kann, aber nur wie?

      <script language="javascript">
      function HideStdValue(field) {
        if (field.value == 'Neue Suche   ') {
          field.value   = '';
          field.onfocus = '';
          }
        }
      </script>

      1. Hallo TONI.

        Ich habe irgendwie im Hinterkopf das man den Inhalt ausklammern kann, aber nur wie?

        Du meinst „maskieren“?

        " -> "

        ' -> '

        Einen schönen Mittwoch noch.

        Gruß, Ashura

        --
        Selfcode: sh:( fo:) ch:? rl:( br:^ n4:& ie:{ mo:) va:) de:> zu:) fl:( ss:| ls:[ js:|
        30 Days to becoming an Opera8 Lover -- Opera 8.02 mit Bittorent-Unterstützung
        Meine Browser: Opera 8.01 | Firefox 1.0.5 | Lynx 2.8.3 | Netscape 4.7 | IE 6.0
        [Deshalb frei! - Argumente pro freie Software]
        1. Hallo Toni,

          ich habe das gleiche Problem bei mir habe ich es so gelöst:

          <script language="javascript">
          function HideStdValue(field) {
            if (field.value == 'Neue Suche   ') {
              field.value   = '';
              field.onfocus = '';
              }
            }
          </script>

          Aber funktionieren tut es trozdem nicht??
          Hier der Link: http://stshome.de/index2.php
          Diverse Zeichenfehler kommen wegen einer Umstellung von UTF8 auf ISO

          1. Bei mir Funktioniert es so:

            <script language="javascript">
            function HideStdValue(field) {
              if (field.value == 'Neue Suche   ') {
                field.value   = '';
                field.onfocus = '';
                }
              }
            </script>

            Du hast beim "Javascript" zugeschlagen...:-)

            1. Danke,

              da hatte ich mir doch einen Ausreißer erlaubt...

              1. So klappt es dann auch mit dem Valiator

                <script language="javascript" type="text/javascript">
                 <!--
                  if(top.frames.length > 0)
                  top.location.href=self.location;
                 //-->
                </script>

                onblur="if(this.value=='')this.value='Neue Suche';" onfocus="if(this.value=='Neue Suche')this.value='';"

  2. Hi,

    Daher möchte ich in einem Input feld den vorgegebenen text (<input id="suche" type="text" name="q" size="9" maxlength="255" value="Neue Suche" ></input>

    Benutzt Du HTML oder XHTML?

    Bei HTML wäre die Benutzung der schließenden tags für input falsch.

    Bei XHTML ist es theoretisch zwar erlaubt, um aber keine Barrieren einzubauen, sollte bei Elementen mit content-model EMPTY (wozu input gehört) dann die Schreibweise mit nur einem Tag benutzt werden (<input ... />), da einige Browser sonst Probleme kriegen.

    ) beim draufklicken verschwinden lassen.

    Ich fände es wesentlich sinnvoller, die Beschriftung eines Input-Feldes neben oder über dem Input-Feld zu platzieren als in dem Feld.

    <label for="suche"></label>
    <input id="suche" type="text" name="q" size="9" maxlength="255" value=" " ></input>

    Das wird von dem Tool als Ok angesehen? Ein leeres Label?
    Was ist der Sinn des leeren Labels? Dein AAA-Prüftool zufriedenzustellen?`

    In dem Label wäre m.E. der richtige Platz für die Beschriftung des Feldes.

    Mit dem Labeltext im value gibt es immer Probleme:
    1. schreibst Du den Wert von Anfang an ins value-Attribut, stört er beim Eingeben, falls kein Javascript aktiv ist, da er erst gelöscht werden muß.
    2. schreibst Du ihn erst per Javascript rein, fehlt die Beschriftung des Feldes, falls kein Javascript aktiv ist.

    cu,
    Andreas

    --
    Warum nennt sich Andreas hier MudGuard?
    Schreinerei Waechter
    Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.