Zeige Ergebnis 1 bis 8 von 8
  1. #1
    Benutzerbild von Zeyall
    Registriert seit
    Jul 2004
    Beiträge
    4.946
    Likes
    0

    javascript: 3 checkboxen+button

    guten morgen

    ich bräuchte eine einfache html seite in der 3 checkboxen und ein button sein sollen. der button soll so lange deaktviert sein bis die checkboxen in einer bestimmten reihenfolge aktiviert wurden (die reihenfolge sollte sich jedes mal ändern und in einem label erscheinen).

    falls das nicht geht eine einfachere version: ohne bestimmte reihenfolge, einfach alle 3 checkboxen aktivieren dass der button enabled wird. beim klicken auf den button soll man dann auf ne bestimmte url kommen (testweise google.de).


    ich bekomms nur mit einer checkbox hin, ich brauche aber 3. thx für die hilfe =)


  2. #2
    Benutzerbild von TroXx
    Registriert seit
    Okt 2007
    Beiträge
    110
    Likes
    4
    Code:
    <html>
    	<head>
    		<title>ElZetto</title>
    		<script type='text/javascript'>
    			function check()
    			{
    				var chBox1 = document.getElementById('chBox1');
    				var chBox2 = document.getElementById('chBox2');
    				var chBox3 = document.getElementById('chBox3');
    				var button = document.getElementById('button');
    				if( chBox3.checked == true 
    					&&  chBox2.checked == true
    						&& chBox1.checked == true )
    				{
    					button.disabled = false;
    				}
    				else
    				{
    					button.disabled = 'disabled';
    				}
    			}
    		</script>
    	</head>
    	<body>
    		<input type='checkbox' id='chBox1' onclick='check();' /> Elzet<br />
    		<input type='checkbox' id='chBox2' onclick='check();' /> LZ<br />
    		<input type='checkbox' id='chBox3' onclick='check();' /> PQ<br />
    		<input type='button' id='button' disabled='disabled' value='Oh noez!' onclick='window.location.href="http://www.google.com"' />
    	</body>
    </html>



    edith:

    und das ganze mit vordefinierter reihenfolge:

    Code:
    <html>
    	<head>
    		<title>ElZetto</title>
    		<script type='text/javascript'>
    			var order = { box1: 0, box2: 0, box3: 0 };
    			var def = { box1: 3, box2: 1, box3: 2 };
    			function check( identifier )
    			{
    				var chBox1 = document.getElementById('chBox1');
    				var chBox2 = document.getElementById('chBox2');
    				var chBox3 = document.getElementById('chBox3');
    				var button = document.getElementById('button');
    				
    				switch( identifier )
    				{
    					case "box2":
    						if( chBox2.checked == true )
    						{
    							p = 1;
    							if( order.box1 != 0 || order.box3 != 0 )
    							{
    								p = 2;
    							}
    							if( order.box3 != 0 && order.box1 != 0 )
    							{
    								p = 3;
    							}
    						}
    						else
    						{
    							p = 0;
    						}
    						order.box2 = p;
    						break;
    					case "box3":
    						if( chBox3.checked == true )
    						{
    							p = 1;
    							if( order.box1 != 0 || order.box2 != 0 )
    							{
    								p = 2;
    							}
    							if( order.box2 != 0 && order.box1 != 0 )
    							{
    								p = 3;
    							}
    						}
    						else
    						{
    							p = 0;
    						}
    						order.box3 = p;
    						break;
    					case "box1":
    					default:
    						if( chBox1.checked == true )
    						{
    							p = 1;
    							if( order.box2 != 0 || order.box3 != 0 )
    							{
    								p = 2;
    							}
    							if( order.box3 != 0 && order.box2 != 0 )
    							{
    								p = 3;
    							}
    						}
    						else
    						{
    							p = 0;
    						}
    						order.box1 = p;
    						break;
    				}
    				
    				if( chBox3.checked == true && order.box3 == def.box3 
    					&&  chBox2.checked == true  && order.box2 == def.box2
    						&& chBox1.checked == true  && order.box1 == def.box1 )
    				{
    					button.disabled = false;
    				}
    				else
    				{
    					button.disabled = 'disabled';
    				}
    			}
    		</script>
    	</head>
    	<body>
    		<input type='checkbox' id='chBox1' onclick='check( "box1" );' /> Elzet<br />
    		<input type='checkbox' id='chBox2' onclick='check( "box2" );' /> LZ<br />
    		<input type='checkbox' id='chBox3' onclick='check( "box3" );' /> PQ<br />
    		<input type='button' id='button' disabled='disabled' value='Oh noez!' onclick='window.location.href="http://www.google.com"' />
    	</body>
    </html>
    (ändere die werte bei "var def = { ... };" um die reihenfolge zu ändern)

  3. #3
    Benutzerbild von Zeyall
    Registriert seit
    Jul 2004
    Beiträge
    4.946
    Likes
    0
    omg ich bin so dankbar. thx

  4. #4
    Benutzerbild von TroXx
    Registriert seit
    Okt 2007
    Beiträge
    110
    Likes
    4
    Hab mal nen fehler im code bereinigt, funktioniert jetzt alles korrekt

  5. #5
    Benutzerbild von Zeyall
    Registriert seit
    Jul 2004
    Beiträge
    4.946
    Likes
    0
    welcher fehler?

    ich hab nurnoch ne else bedinung eingenaut, wenn man ne checkbox wieder deaktiviert soll der button wieder disabled sein

    edit: das hast du auch gemacht oder?

  6. #6
    Benutzerbild von TroXx
    Registriert seit
    Okt 2007
    Beiträge
    110
    Likes
    4
    Original geschrieben von Zeyall
    welcher fehler?

    ich hab nurnoch ne else bedinung eingenaut, wenn man ne checkbox wieder deaktiviert soll der button wieder disabled sein

    edit: das hast du auch gemacht oder?
    klar

  7. #7
    Benutzerbild von Zeyall
    Registriert seit
    Jul 2004
    Beiträge
    4.946
    Likes
    0
    Original geschrieben von TroXx
    klar
    aber erst bei der korrektur oder? :x^

  8. #8
    Benutzerbild von TroXx
    Registriert seit
    Okt 2007
    Beiträge
    110
    Likes
    4
    Original geschrieben von Zeyall
    aber erst bei der korrektur oder? :x^
    jo :<

Forumregeln

  • Es ist dir nicht erlaubt, neue Themen zu verfassen.
  • Es ist dir nicht erlaubt, auf Beiträge zu antworten.
  • Es ist dir nicht erlaubt, Anhänge hochzuladen.
  • Es ist dir nicht erlaubt, deine Beiträge zu bearbeiten.
  •