Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Zmiana koloru tła w polu input
Forum PHP.pl > Forum > Po stronie przeglądarki > JavaScript
m_iwanicki
Jak zmienic kolor tła w polu input questionmark.gif


Kod
if(document.form.zaznacz.checked==true)
{
      document.form.pole................. i tu che wykonac zmiany koloru tła pola
}



Z góry dzięki za odpowiedź.
marlowe
  1. <script language='JavaScript' type="text/javascript">
  2. <!--
  3. function zmienKolor(a)
  4. {
  5. if (document.formularz.checkbox1.value="on")
  6. document.formularz.text1.style.backgroundColor='red';
  7. }
  8. //-->
  9. <form name="formularz">
  10. <input type="text" id="text1" />
  11. <br/>
  12. <input type="checkbox" id="checkbox1" onclick="javascript:zmienKolor(1)" />
  13. </form>

(dałem onclick, nie on change bo pod IE to lepiej działa)
Pozdrawiam.
Bartek
MP1
Ja przedstawię lepszy sposób, przydatny jeśli zmieniasz więcej atrybutów i styli obiektu.

1. Tworzysz style. (nazwy podałem przykładowe)
  1. <style type="text/css">
  2. .f { background-color: yellow; border: 1px solid blue }
  3. .t { background-color: blue; border: 1px solid yellow }


potem w JS robisz tak:
document.form.pole.className='nazwa_klasy'

No i przykład:

  1. <input type="checkbox" name="pole" id="pole" class="f" onclick="this.className='t'" />
marlowe
Można poszaleć jeszcze bardziej i w parametrach funkcji określić i styl, i Id elementu, dla którego ma być on zmienany:
  1. <style type='text/css'>
  2. <!--
  3. .styl1 { background-color: red; }
  4. .styl2 { background-color: blue; }
  5. .styl3 { background-color: yellow; }
  6. //-->
  7. <script language='JavaScript' type="text/javascript">
  8. <!--
  9. ktory='text1'; //domyślne ustawienie
  10. styl='styl1'; //domyślne ustawienie
  11. function zmienKolor(checkbox,ktory,styl)
  12. {
  13. if (document.getElementById(checkbox).value="on")
  14. document.getElementById(ktory).className=styl;
  15. }
  16. //-->
  17. <form name="formularz">
  18. <input type="text" id="text1" />
  19. <input type="text" id="text2" />
  20. <input type="text" id="text3" />
  21. <br/>
  22. <input type="checkbox" id="checkbox1" onclick="javascript:zmienKolor(this.id,'text3','styl2')" />
  23. </form>

Pozdrawiam.
Bartek
slimboot
Po co pisać tyle kodu? nie wystarczy CSS?

Kod
style="background-color:yellow"
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.