Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [JS]Zaznaczanie i odznaczanie wierszy/pól
Forum PHP.pl > Forum > Po stronie przeglądarki
Oczko21
Witam,
Mam problem ze zrobieniem mozliwosci zaznaczania i odznaczania wierszy/pól. Chciałbym aby w momencie zaznaczenia innego wiersza, poprzednie wracało do normalnego stanu. Kombinowałem coś takiego:
  1. function select_option(id)
  2. {
  3. <!-- Probowałem też coś takiego:
  4. document.getElementsByTagName('li').style.fontWeight='100';
  5. -->
  6. document.getElementById('option-list').style.fontWeight='100';
  7. document.getElementById(id).style.fontWeight='bold';
  8. }
  9.  
  10.  
  11.  
  12. <ul id="option-list">
  13. <li id="1" onclick="select_option(1)">Opcja 1</li>
  14. <li id="2" onclick="select_option(2)">Opcja 2</li>
  15. <li id="3" onclick="select_option(3)">Opcja 3</li>
  16. <ul>
  17. <li id="4" onclick="select_option(4)">Podopcja 1</li>
  18. <li id="5" onclick="select_option(5)">Podopcja 2</li>
  19. </ul>
  20. </ul>


Ale coś to wszystko nie chce razem współgrać. Ktoś mógłby nakierować mnie na prawidłowe rozwiązanie? smile.gif
Rid
Przecież Pan tej funkcji w ogóle nie wywołuje.

  1. function select_option()
  2.  
  3. {
  4. document.getElementById('option-list').style.fontWeight='100';
  5. document.getElementById('1').style.fontWeight='bold';
  6. }
  7. #
  8. <ul id="option-list">
  9. <li id="1" onselect="select_option()"></li>
  10. </ul>


Przykład pisany z palca więc nie wiem czy zadziała.
Oczko21
Sry, zapomniałem tego dopisać tworząc post. Już poprawiłem
kamil4u
Zrób tak:
- w chwili kliknięcia nadajesz dodatkową klasę - np. active
- przed tym wyszukujesz elementu o takiej klasie - getElementsByClassName i zmieniasz wartość "staremu" elementowi
- w parametrze nie przekazuj liczby "1", tylko:
Kod
onclick="funkcja(this)"
, a w funkcji:
Kod
function funkcja( element){ /*w zmiennej element masz referencję do klikniętego elementu*/ }

- id nie może być liczbą
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.