Darmowe Forum
Maj 19, 2024, 16:07:40
Witamy,
Gość
.
Zaloguj się
lub
zarejestruj
.
Czy dotarł do Ciebie
email aktywacyjny?
1 Godzina
1 Dzień
1 Tydzień
1 Miesiąc
Zawsze
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 2241 razy)
admin
Administrator
Ekspert
Wiadomości: 821
Transfer danych z radio button do text
«
:
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
Odp: Transfer danych z radio button do text
«
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
Odp: Transfer danych z radio button do text
«
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:
Wybierz cel:
-----------------------------
Zadanie C++ lutego -Agnieszka
-----------------------------
=> Nowy dział
=> Zadanie
-----------------------------
E14
-----------------------------
=> DIV
=> Java Script
=> php
-----------------------------
Dla Magdy i Wojtka
-----------------------------
=> Liczby dwójkowe
-----------------------------
Przykłady stron internetowych
-----------------------------
=> Strona zbudowana z tabelek
-----------------------------
Podstawy PHP
-----------------------------
=> Przesyłanie danych z formularza php
=> Pętle w php
-----------------------------
Java Script
-----------------------------
=> Java Script
-----------------------------
C++ Nowe rozdanie
-----------------------------
=> C++
-----------------------------
Java JDK
-----------------------------
=> Java ale nie Script
-----------------------------
Hyde Park
-----------------------------
=> Informacje
-----------------------------
C+++
-----------------------------
=> A Kuba powiedział
-----------------------------
Multimedia
-----------------------------
=> Photoshop
=> Nowy dział
=> Java Script
=> Corel
-----------------------------
Html-strony internetowe
-----------------------------
=> Podstawy HTML- ramki/ frames
=> Podstawy HTML- tabelki
-----------------------------
C++
-----------------------------
=> Podstawy C++ cz. I
=> Kompilatory C++
=> Programowanie obiektowe w C++
=> Problem w C++
=> Podstawy
=> C++ po raz pierwszy
-----------------------------
Turbo Pascal
-----------------------------
=> Turbo Pascal semestr II
=> Projekt AŚKA
=> Turbo Pascal semestr I
=> Podstawy Turbo Pascal
Ładowanie...
Polityka cookies
Darmowe Fora
|
Darmowe Forum
st-fu
pracadlazbrojarza
storylife
linkinparknewsrevolution
wilczezycie