Joachim: Per Mausklick einem Formularfeld CSS zuweisen?

Hallo Leute,

habe folgendes Problem;

Ich habe ein Formular und möchte, dass wenn man auf einen
bestimmten Button klickt, alle Formularfelder nicht weiss,
sondern gelb hinterlegt sind.

Bekomme ich mit Javascript nicht hin.
Also per Klick einer Formularfeld die CSS-Klasse "gelb"
zuweisen (als Beispiel)...

Könnt Ihr mir helfen??

Grüße

Joachim

  1. <javascript>
    function machGelb()
    {
    document.getElementById('bla').style.backgroundColor='yellow';
    }
    </script>

    <input type="text" name="bla" id="bla">
    <a href="#" onclick="machGelb();">klick mich!</a>

    noch eine schleife über alle formularfelder und alles wird gelb.

    1. Mahlzeit,

      <javascript>
      function machGelb()
      {
      document.getElementById('bla').style.backgroundColor='yellow';
      }
      </script>

      Prinzipiell richtig, ich würde aber folgendes empfehlen:

        
      <style type="text/css">  
      [code lang=css]  
      input.markiert {  
        background-color: #ff0;  
      }
      

      </style>
      <script type="text/javascript">

        
      function markiere()  
      {  
        var inputs = document.getElementsByTagName('INPUT');  
        
        for (var i = 0; i < inputs.length; i++)  
        {  
          inputs[i].className = 'markiert';  
        }  
      }
      

      </script>
      <button onclick="markiere();">Felder markieren</button>[/code]

      So hat man Struktur, Layout und Funktionalität klarer voneinander getrennt (und wenn man irgendwann mal die Eingabefelder nicht mehr gelb hinterlegt, sondern blau umrandet mit lila Punkten haben will, muss man nur an einer Stelle das Design ändern).

      MfG,
      EKKi

      --
      sh:( fo:| ch:? rl:( br:> n4:~ ie:% mo:} va:) de:] zu:) fl:{ ss:) ls:& js:|
      1. Mahlzeit,

        <javascript>
        function machGelb()
        {
        document.getElementById('bla').style.backgroundColor='yellow';
        }
        </script>

        Prinzipiell richtig, ich würde aber folgendes empfehlen:

        <style type="text/css">
        [code lang=css]
        input.markiert {
          background-color: #ff0;
        }

        
        > </style>  
        > <script type="text/javascript">  
        > ~~~javascript
          
        
        > function markiere()  
        > {  
        >   var inputs = document.getElementsByTagName('INPUT');  
        >   
        >   for (var i = 0; i < inputs.length; i++)  
        >   {  
        >     inputs[i].className = 'markiert';  
        >   }  
        > }
        
        

        </script>
        <button onclick="markiere();">Felder markieren</button>[/code]

        So hat man Struktur, Layout und Funktionalität klarer voneinander getrennt (und wenn man irgendwann mal die Eingabefelder nicht mehr gelb hinterlegt, sondern blau umrandet mit lila Punkten haben will, muss man nur an einer Stelle das Design ändern).

        MfG,
        EKKi

        WOW EKKI, das ist ja der Hammer,

        das probier ich gleich mal aus!!!!

        Dankeeeeeeeeeeeeeeeeeeeeeeeeee!!!!!

        Grüße

        Joachim

      2. »

        So hat man Struktur, Layout und Funktionalität klarer voneinander getrennt (und wenn man irgendwann mal die Eingabefelder nicht mehr gelb hinterlegt, sondern blau umrandet mit lila Punkten haben will, muss man nur an einer Stelle das Design ändern).

        MfG,
        EKKi

        WOW, danke EKKI,

        werds gleich mal probieren. Vielen vielen Dank!!!

        Grüße

        Joachim