Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: zmiana pola w select zmienia atrybuty div'a
Forum PHP.pl > Forum > Po stronie przeglądarki > JavaScript
swist666
Witam,

Na początku zaznaczam że w ogóle nie ogarniam javy, piszę w php tylko więc to co stworzyłem może być totalnym bełkotem tongue.gif napisałem formularz i chcę aby po zmianie pewnego pola (<select>) zmieniały się również atrybuty innego div'a, a w zasadzie to tylko jeden - visability. Wygląda to mniej więcej tak:

  1. <select name="rodzaj">
  2. <option value="k">1</option>
  3. <option value="m">2</option>
  4. <option value="p">3</option>
  5. <option value="l">4</option>
  6.  
  7. <div id="pierwszy_div">
  8. </div>
  9.  
  10. <div id="drugi_div">
  11. </div>
  12.  
  13. <div id="trzeci_div">
  14. </div>


i chciałbym aby w momencie kiedy użytkownik zmieni wartość zmiennej "rodzaj" pojawiają się dane divy.. np. 1 = 2 pierwsze divy widoczne, 2 = wszystkie divy widoczne, 3 - pierwszy i trzeci itd.

wstępnie napisałem coś takiego ale nie działa sad.gif

  1. <script type="text/javascript">
  2. <!--
  3. function ZmienTyp() {
  4. if ( document.getElementById("rodzaj").value=='m' ) {
  5. document.getElementById("imie").style.visibility='hidden';
  6. }
  7. else {
  8. document.getElementById("imie").style.visibility='visible';
  9. }
  10. }
  11. //-->
  12.  
  13. <select name="rodzaj">
  14. <option value="k">1</option>
  15. <option value="m">2</option>
  16. <option value="p">3</option>
  17. <option value="l">4</option>
  18.  


ktoś ma jakieś pomysły??
piotrooo89
coś takiego:

  1. <script type="text/javascript">
  2. function ZmienTyp(ile)
  3. {
  4. if ( ile=='m' )
  5. {
  6. document.getElementById("pierwszy_div").style.visibility='visible';
  7. document.getElementById("drugi_div").style.visibility='visible';
  8. document.getElementById("trzeci_div").style.visibility='hidden';
  9. }
  10. }
  11.  
  12. <select name="rodzaj" onChange="ZmienTyp(this.value)">
  13. <option value="k">1</option>
  14. <option value="m">2</option>
  15. <option value="p">3</option>
  16. <option value="l">4</option>
  17.  
  18.  
  19. <div id="pierwszy_div">
  20. 1
  21. </div>
  22.  
  23. <div id="drugi_div">
  24. 2
  25. </div>
  26.  
  27. <div id="trzeci_div">
  28. 3
  29. </div>


reszte se dorób sam.
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.