kostenloser Webspace werbefrei: lima-city

Funktion zum deaktivieren verschiedener Textfelder

lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript

1. Autor dieses Themas

   moneyprojekt

   moneyprojekt hat kostenlosen Webspace.

   20:50, 13.6.2012

   Hey,
   Ich arbeite gerade an einem Formular und möchte Textboxen mit Checkboxen deaktivieren.
   
   Ich habe eine Lösung gefunden, aber wie man weiter unten sieht, brauche ich 3 Funktionen für 3 Textboxen.
   Gibt es eine Möglichkeit daraus eine einzige Funktion zu machen?
   Es ist wichtig, dass sie deaktiviert werden können - leer lassen ist keine Lösung.
   
   So sieht's zur Zeit aus:
   
   HTML:
   

   <form action="[zensiert]"   method="post">
     <table border="0" cellpadding="0" cellspacing="4">
       <tr>
         <td align="right">Name:</td>
         <td><input type="Checkbox" name="c1" onclick="aktiv1()" checked="true"></td>
         <td><input name="t1" type="text" size="30" maxlength="30"></td>
       </tr>
       
       <tr>
         <td align="right">Country:</td>
         <td><input type="Checkbox" name="c2" onclick="aktiv2()" checked="true"></td>
         <td><input name="t2" type="text" size="30" maxlength="30"></td>
       </tr>
       <tr>
         <td align="right">Location</td>
         <td><input type="Checkbox" name="c3" onclick="aktiv3()" checked="true"></td>
         <td><input name="t3" type="text" size="30" maxlength="30"></td>
       </tr>
     </table>
   </form>]

   
   
   Javascript:
   

   <script type='text/javascript'>
   
       function aktiv1(){
            if (document.forms[0].c1.checked){
                document.forms[0].t1.disabled=false;
            } else {
                document.forms[0].t1.disabled=true;
            }
       }
   	
   	function aktiv2(){
            if (document.forms[0].c2.checked){
                document.forms[0].t2.disabled=false;
            } else {
                document.forms[0].t2.disabled=true;
            }
       }
   	function aktiv3(){
            if (document.forms[0].c3.checked){
                document.forms[0].t3.disabled=false;
            } else {
                document.forms[0].t3.disabled=true;
            }
       }
      </script>

   
   
   Danke im Voraus

2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

   lima-city: Gratis werbefreier Webspace für deine eigene Homepage

3. hackyourlife

   Moderator

   hackyourlife hat kostenlosen Webspace.

   21:39, 13.6.2012

   Mach es so:

   <form action="[zensiert]"   method="post">
     <table border="0" cellpadding="0" cellspacing="4">
       <tr>
         <td align="right">Name:</td>
         <td><input type="Checkbox" name="c1" onclick="validate(this, document.getElementById('t1'));" checked="true"></td>
         <td><input name="t1" id="t1" type="text" size="30" maxlength="30"></td>
       </tr>
       
       <tr>
         <td align="right">Country:</td>
         <td><input type="Checkbox" name="c2" onclick="validate(this, document.getElementById('t2'));" checked="true"></td>
         <td><input name="t2" id="t2" type="text" size="30" maxlength="30"></td>
       </tr>
       <tr>
         <td align="right">Location</td>
         <td><input type="Checkbox" name="c3" onclick="validate(this, document.getElementById('t3'));" checked="true"></td>
         <td><input name="t3" id="t3" type="text" size="30" maxlength="30"></td>
       </tr>
     </table>
   </form>
   
   <script type="text/javascript"><!--
   function validate(checkbox, textfield) {
   	textfield.disabled = !checkbox.checked;
   }
   // --></script>

4. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

   lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?