Tytu³: Transfer danych z radio button do text Wiadomo¶æ wys³ana przez: admin Kwiecieñ 27, 2016, 07:27:35 Zadanie 1. Wybór za pomoc± radio button marki samochodu oraz koloru t³a. Umieszczenie nazwy marki samochodu i koloru t³a w polu text oraz zmiana koloru t³a na zaznaczony za pomoc± radio button.
<html> <head> <meta charset="UTF-8"> <script> var d=0;e=0; function kolor() { if(document.getElementById("c").checked == true) {document.body.style.backgroundColor = "red"; document.getElementById("nazkol").value="CZERWONY";}; if(document.getElementById("z").checked == true) {document.body.style.backgroundColor = "green"; document.getElementById("nazkol").value="ZIELONY";}; if(document.getElementById("m").checked == true) {document.body.style.backgroundColor = "magenta"; document.getElementById("nazkol").value="MAGENTA";}; if(document.getElementById("t").checked == true) {document.body.style.backgroundColor = "#AAFFAA"; document.getElementById("nazkol").value="TURKUSOWY";}; } function woz(E){document.getElementById("wybor").value=E;} </script> </head> <body> <font size="20"><b>Konfiguracja samochodu</b></font> <br><br> <table><td> <form style="width:200px" > <fieldset> <legend>Wybierz samochód</legend> <br> <input type="radio" name="E" id="1" value="OPEL" onclick="woz(this.value)"> OPEL <br> <input type="radio" name="E" id="2" value="FIAT" onclick="woz(this.value)"> FIAT<br> <input type="radio" name="E" id="3" value="TOYOTA" onclick="woz(this.value)"> TOYOTA <br> <input type="radio" name="E" id="4" value="MAZDA" onclick="woz(this.value)"> MAZDA <br> </fieldset> </form> <td> <td> <form style="width:200px" > <fieldset> <legend>Wybierz kolor</legend><br> <input type="radio" name="A" id="c" onclick="kolor()" > CZERWONY <br> <input type="radio" name="A" id="z" onclick="kolor()" > ZIELONY <br> <input type="radio" name="A" id="m" onclick="kolor()" > MAGENTA<br> <input type="radio" name="A" id="t" onclick="kolor()" > TURKUSOWY <br> </fieldset> </form> </td> <td> <form style="width:200px" > <fieldset> <legend>Wybrano model</legend><br> <input type="text" id="wybor" name="B" size="10"> <br><br> <input type="text" id="nazkol" name="B" size="10"> <br><br> </fieldset> </form> </td> </table> </body> </html> Tytu³: Odp: Transfer danych z radio button do text Wiadomo¶æ wys³ana przez: admin Kwiecieñ 27, 2016, 09:15:04 Wersja z miastami i ¶rodkami transportu do wyboru.
<html> <head> <meta charset="UTF-8"> <script> var d=0;e=0; function kolor() { if(document.getElementById("au").checked == true) {document.getElementById("srodek").value="AUTOBUS";}; if(document.getElementById("poc").checked == true) {document.getElementById("srodek").value="POCI¡G";}; if(document.getElementById("sam").checked == true) {document.getElementById("srodek").value="SAMOCHÓD";}; if(document.getElementById("sl").checked == true) {document.getElementById("srodek").value="SAMOLOT";}; } function miasto(E){document.getElementById("wybor").value=E;} </script> </head> <body> <font size="10"><b>Zakup biletu</b></font> <br><br> <table><td> <form style="width:200px" > <fieldset> <legend>Dok±d jedziesz</legend> <br> <input type="radio" name="E" id="1" value="Gdañsk" onclick="miasto(this.value)"> GDAÑSK <br> <input type="radio" name="E" id="2" value="Pisz" onclick="miasto(this.value)"> PISZ<br> <input type="radio" name="E" id="3" value="Kosów Lacki" onclick="miasto(this.value)"> KOSÓW LACKI <br> <input type="radio" name="E" id="4" value="Bia³ystok" onclick="miasto(this.value)"> BIA£YSTOK <br> <input type="radio" name="E" id="5" value="Kraków" onclick="miasto(this.value)"> KRAKÓW <br> </fieldset> </form> </td> <td> <form style="width:200px" > <fieldset> <legend>¦rodek transportu</legend><br> <input type="radio" name="A" id="au" onclick="kolor()" > AUTOBUS <br> <input type="radio" name="A" id="poc" onclick="kolor()" > POCI¡G <br> <input type="radio" name="A" id="sam" onclick="kolor()" > SAMOCHÓD<br> <input type="radio" name="A" id="sl" onclick="kolor()" > SAMOLOT <br><br> </fieldset> </form> </td> <td> <form style="width:300px" > <fieldset> <legend>Warunki podró¿y</legend><br> Miejsce docelowe: <input type="text" id="wybor" name="B" size="10"> <br><br> ¦rodek transportu: <input type="text" id="srodek" name="B" size="10"> <br><br><br> </fieldset> </form> </td> </table> </body> </html> Tytu³: Odp: Transfer danych z radio button do text Wiadomo¶æ wys³ana przez: admin Kwiecieñ 27, 2016, 12:00:02 Zadanie 3. W zasadzie wszystko to samo co w poprzednim przyk³adzie, jednak zaznaczenie checkbox powoduje wy¶wietlenie tekstu w form ale bez udzia³u okienek tekstowych.
<html> <head> <meta charset="UTF-8"> <script> var d="ssas";e=0; function kolor() { if(document.getElementById("au").checked == true) {document.getElementById("srodek").value="AUTOBUS";}; if(document.getElementById("poc").checked == true) {document.getElementById("srodek").value="POCI¡G";}; if(document.getElementById("sam").checked == true) {document.getElementById("srodek").value="SAMOCHÓD";}; if(document.getElementById("sl").checked == true) {document.getElementById("srodek").value="SAMOLOT";}; } function miasto(E){document.getElementById("wybor").value=E;} function tekst(){location.reload(); } </script> </head> <body> <font size="10">Zakup biletu</font> <br><br> <table><td> <form style="width:200px" > <fieldset> <legend>Dok±d jedziesz</legend> <br> <input type="radio" name="E" id="1" value="Gdañsk" onclick="miasto(this.value)"> GDAÑSK <br> <input type="radio" name="E" id="2" value="Pisz" onclick="miasto(this.value)"> PISZ<br> <input type="radio" name="E" id="3" value="Kosów Lacki" onclick="miasto(this.value)"> KOSÓW LACKI <br> <input type="radio" name="E" id="4" value="Bia³ystok" onclick="miasto(this.value)"> BIA£YSTOK <br> <input type="radio" name="E" id="5" value="Kraków" onclick="miasto(this.value)"> KRAKÓW <br> </fieldset> </form> </td> <td> <form style="width:200px" > <fieldset> <legend>¦rodek transportu</legend><br> <input type="radio" name="A" id="au" onclick="kolor()" > AUTOBUS <br> <input type="radio" name="A" id="poc" onclick="kolor()" > POCI¡G <br> <input type="radio" name="A" id="sam" onclick="kolor()" > SAMOCHÓD<br> <input type="radio" name="A" id="sl" onclick="kolor()" > SAMOLOT <br> <input type="checkbox" name="B" id="ch" onclick="tekst()" > miejsce dla pal±cych<br> </fieldset> </form> </td> <td> <form style="width:300px" id="for" > <fieldset> <legend>Warunki podró¿y</legend><br> Miejsce docelowe: <input type="text" id="wybor" name="B" size="10"> <br><br> ¦rodek transportu: <input type="text" id="srodek" name="B" size="10"> <br><br> <script> if(document.getElementById("ch").checked == true) {document.writeln("Dla pal±cych")} else {document.writeln(" Kuba chce dla niepal±cych");}; </script><br> </fieldset> </form> </td> </table> </body> </html> |