<input Feld wieder zurücksetzen

[mkoeni1]

Hallo Leute,

ich habe folgendes Problem und benötige Eure Hilfe.
Ich habe ein Formular das man ausfüllen muss um es abzuschicken. Ich hatte hierzu zuerst etwas mit CSS versucht um den Fehler anzuzeigen. -> Das ging auch aber das gefällt mir nicht so sehr.
Jetzt mache ich es dem direkten Ansprechen des value eines input Feldes.
Nur habe ich ein Problem:
Nach Verlassen des Feldes ist dieses immer noch mit der Farbe rot versehen. Wie kann ich dies ändern?

Am Besten ich poste mal das Alte Script: register.php

<form name="register" action="index.php?action=Register" method="POST" onSubmit="return check_form()">
  <table>
    <tr>
      <th colspan="3">Registrieren Sie sich bitte hier: (*=Pflichtfeld)</th>
     </tr>
     <tr>
      <td  style="font-family: verdana,arial,helvetica; font-size : 75%; text-align: right;">Passwort wiederholen*</td>
      <td><input type="password" name="password2" onFocus='this.style.backgroundColor="#FFC"' onBlur="set()"></td>
      <td><div id="error4">Fehler - Passwort best&auml;tigen.</div><div id="error12">Passwoerter sind ungleich lang!</div><div id="error13">Passwoerter sind unterschiedlich!</div></td>
    </tr>
....
</form>

Hierzu habe ich in der CSS Datei Haufenweise diese errorx stehen.:

...
#error12 {
  display: none;
  font-family : verdana,arial,helvetica; 
  font-size : 88%;
  color: #800000;
}
#error4 {
  display: none;
  font-family : verdana,arial,helvetica; 
  font-size : 88%;
  color: #800000;
}
#error13 {
  display: none;
  font-family : verdana,arial,helvetica; 
  font-size : 88%;
  color: #800000;
}
...

Jetzt löse ich das ganze eleganter indem ich direkt den value eines input Felder des Formulars anrede: register.php

<form name="register" action="index.php?action=Register" method="POST" onSubmit="return check_form()">
  <table>
    <tr>
      <th colspan="3">Registrieren Sie sich bitte hier: (*=Pflichtfeld)</th>
     </tr>
     <tr>
      <td style="font-family: verdana,arial,helvetica; font-size : 75%; text-align: right;">Benutzername*</td>
      <td><input type="text" name="benutzer" value="" style="font-family: verdana,arial,helvetica; font-size : 75%; color:#800000;" onFocus='this.style.backgroundColor="#FFC"' onBlur="set()"></td>
      <td>&nbsp;</td></tr>
    <tr>
...

die Javascript Funktion sieht jetzt so aus:

<script language="JavaScript">
// Formular Eingaben pruefen
function check_form(){
  // Pruefen, ob der Benutzername nicht leer ist
  // zB. erstes Formular drittes Feld - window.document.forms[0].elements[2].value
  var fFelder = new Array(6);
for (var i = 0; i < fFelder.length; ++i){
  fFelder[i] = document.forms['register'].elements[i].value;
}
  
  // Fuehrende Leerzeichen aus dem Bentzernamen entfernen
  // benutzer
  if(fFelder[0] == ""){
    window.document.forms['register'].elements[0].focus();
    document.forms['register'].elements[0].value = "Bitte Benutzer eingeben";
    document.forms['register'].elements[0].value;
    return false;
  }
...
</script>

Vielen Dank
Gruß Matze

 

[Sven Mintel]

Nach Verlassen des Feldes ist dieses immer noch mit der Farbe rot versehen. Wie kann ich dies ändern?

Naja, wie du die Hintergrundfarbe änderst, weisst du ja, das steht ja beim onFocus() bereits drinnen. Nimm die selbe Aebenfalls beim onBlur und ändere den Farbwert lediglich auf den gewünschten.