Darmowe Forum
Grudzieñ 22, 2024, 07:44:09 *
Witamy, Go¶æ. Zaloguj siê lub zarejestruj.
Czy dotar³ do Ciebie email aktywacyjny?

Zaloguj siê podaj±c nazwê u¿ytkownika, has³o i d³ugo¶æ sesji
Aktualno¶ci: Forum zosta³o uruchomione!
 
   Strona g³ówna   Pomoc Zaloguj siê Rejestracja  
Darmowe Forum > Java Script > Java Script > Transfer danych z radio button do text
Strony: [1]
« poprzedni nastêpny »
  Drukuj  
Autor W±tek: Transfer danych z radio button do text  (Przeczytany 2432 razy)
admin
Administrator
Ekspert
*****
Wiadomo¶ci: 821


Email
« : 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>
Zapisane
admin
Administrator
Ekspert
*****
Wiadomo¶ci: 821


Email
« Odpowiedz #1 : 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>
Zapisane
admin
Administrator
Ekspert
*****
Wiadomo¶ci: 821


Email
« Odpowiedz #2 : 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>
Zapisane
Strony: [1]
  Drukuj  
« poprzedni nastêpny »
 
Skocz do:  

Powered by SMF 1.1.11 | SMF © 2006-2008, Simple Machines LLC | Sitemap

Polityka cookies
Darmowe Fora | Darmowe Forum

gang-nd blackmoon zlotasiodemka moikrewni articz