Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [HTML + CSS] Użycie wiersza tabeli <TR> jako linku (href)
Forum PHP.pl > Forum > Przedszkole
koziet
Witam. Czy da się użyć wiersza tabeli <TR> tak, by zachowywał się jak <A> ? Tzn. mam już przygotowane style w CSS dla tabeli. Jak przesuwam kursor myszy pomiędzy wierszami to zmieniają one kolory no i wygląda to fajnie ale teraz chciał bym jeszcze aby po kliknięciu na wskazany wiersz przenieść użytkownika pod określony link. Wiem, że mogę do tego użyć javascript i zdarzenia onClick ale pytam czy można inaczej? Nie chcę też używać tego samego elementu <A> w każdej komórce wiersza jak poniżej:
<TR class="highlight">
<TD><A href="http://www.nic.pl">tekst 1</A></TD>
<TD><A href="http://www.nic.pl">tekst 2</A></TD>
<TD><A href="http://www.nic.pl">tekst 3</A></TD>
</TR>

Idealnie było by gdyby możliwe było stworzenie w CSS klasy z paramertem i w HTML'u wywołanie np:
<TR class="highlight http://www.nic.pl">
<TD>Test 1</TD>
<TD>Test 2</TD>
<TD>Test 3</TD>
</TR>
<TR class="highlight http://www.cos.pl">
<TD>Test 4</TD>
<TD>Test 5</TD>
<TD>Test 6</TD>
</TR>

Ale chyba zbyt wiele wymagam, co?
loko0
Jeśli już chcesz z TR zrobić link, to myślę, że JavaScript będzie pomocny. Piszesz funkcję:
  1. function przekieruj(url)
  2. {
  3. window.location.href = url;
  4. }

...a do każdego TR dodajesz:
  1. onlick="przekieruj('http://forum.php.pl')"
hiszpanespaniol
z "class" kombinowałeś w dobrą stronę, ale:
znacznie lepszym rozwiązaniem byłoby zbudować skrypt który "przeleci" wszystkie wiersze tabeli (pętla for dla tablicy elementów "tr"), pobierze z nich atrybut "title" (który jest dla Ciebie lepszy niż "class", bo ludzie zobaczą adres zanim klikną), doda do każdego zdarzenie onclick i po kliknięciu przeniesie pod adres wskazany w "title". Pozbywasz się "onclick" z html'a, a to duża zaleta.

Niestety bez javascript się nie da tego zrobić.
kazag
no chyba, ze w kazdej komorce bedziesz mial link wyswietlany jako blok o wysokosci i szerokosci komorki... wtedy najezdzajac na komorke siłą rzeczy najezdzasz na link o display:block; ...
hiszpanespaniol
w takim przypadku błyskawicznie po przeniesieniu pod adres z <tr> przeniosło by pod adres z odnośnika (dwa razy "wstecz" aby wrócić do swojej strony). To chyba i lepiej, że jeżeli ktoś celowo wstawi tam link, to on ma zadziałać, a nie ten z <tr>.

Żeby to zadziałalo też w przypadku gdy klikniemy w link, trzeba w javascript ustawić "return false" dla każdego linka znajdującego się wewnątrz <tr> z onclick'iem. Teraz nawet jak ktoś kliknie w link <a> wewnątrz wiersza, to przejdzie pod adres który ustawiliśmy w "title" dla <tr>
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.