Forum PHP.pl > [JavaScript]Zmiana stylu elementu

Pomoc - Szukaj - Użytkownicy - Kalendarz

Pełna wersja: [JavaScript]Zmiana stylu elementu

stefik4

8.10.2010, 17:42:15

[PHP] pobierz, plaintext 
<script type="text/javascript">
 
function show(co,ile,ile2){
 
switch(co){
	case 'junior': var na = 'senior'; break;
	case 'senior': var na = 'junior'; break;
};
 
alert('chcesz zobaczyc pola: '+co+'1-'+ile+', a ukryc: '+na+'1-'+ile2);
 
			   for(i=0;i<=ile;i++) 
   { document.getElementById(co+'_'+i).style.border='2px dotted #24c3d1'; }
 
			   for(z=0;z<=ile2;z++) 
   { document.getElementById(na+'_'+z).style.border='0px dotted #24c3d1'; }
 
}
 
</script> 
[PHP] pobierz, plaintext

Posiadam taki kod JS. Mam an stronie tabelę, której linie przedstawiają się następująco:
<tr id="senior_0">...</tr>
<tr id="junior_0">...</tr>
<tr id="senior_1">...</tr>
<tr id="senior_2">...</tr>
<tr id="junior_1">...</tr>
<tr id="senior_3">...</tr>
<tr id="senior_4">...</tr>
<tr id="senior_5">...</tr>
<tr id="junior_2">...</tr>
<tr id="senior_6">...</tr>

Pod tym wszystkim mam dwa odnośniki:

[PHP] pobierz, plaintext 
<a href="#" onclick="show('junior','2','6')">Pokaż juniorów</a>
<a href="#" class="black_buttons" onclick="show('senior','6','2')">Pokaż seniorów</a>
[PHP] pobierz, plaintext

gdy kliknę na pokaz juniorów to prawidłowo bierze w ramkę tych juniorów, lecz jeśli później kliknę w pokaz seniorów to juniorzy się nie odznaczają jakby, czyli coś nie tak jest z drugą częścią kodu ;/

Walczę z tym już od dawna i nie mogę sobie poradzić ;/

zegarek84

8.10.2010, 18:09:25

ale kiedy tak patrze na przykładowy kod wierszy w tabelce to ten skrypt w ogóle nie powinien działać - a dlaczego - zaraz sam sobie odpowiesz i zapewne tu masz bład w drugiej części...

co jest generowane w js przez:
co+'_'+i

a jakie masz id?? junior1 - więc coś tu nie tak??

i dalej podobnie i z odznaczaniem i z seniorami:
na+'_'+z
senior6

zapewne gdzieś to ujednoliciłeś ale zapomniałeś o poprawieniu kodu ukrywania - poza tym po co to tak dziwnie okrężną drogą gdzie musisz znać liczbę elementów - nie było na klasach czy jak to zrobić

stefik4

8.10.2010, 18:33:32

Właśnie nie wiem zbytnio jak to zrobić an klasach ;/

// A Co do tej tabeli to błądnie tam wpisałem przyklad. sorry za pomyłkę.

// moga byc od 0, bo w tych liniach tr id tez mam od 0. Nadal nie wiem jak zrobic element.getdocument by class ;/

BaN

8.10.2010, 19:53:09

Obie pętle for(...) mają być od 1 a nie od 0

skowron-line

8.10.2010, 20:55:40

Ogólnie cała funkcja jest źle zbudowana, no ale jakby to już co innego

[JAVASCRIPT] pobierz, plaintext 
var table = document.getElementById('table');
var tr = table.getElementsByTagName('tr');
for(var i=0; i<=tr.length; i++)
{
if(tr[i].id.indexOf(junior_senior) //<---- sprawdzasz czy w ID znajduje się szukany ciąg "junior" lub "senior" UWAGA indexOf nie działa w IE
{
// pokazujesz
}
else
{
// ukrywasz
}
}
[JAVASCRIPT] pobierz, plaintext

Albo przeczytaj sobie https://developer.mozilla.org/En/DOM/Document.querySelector to i pokombinuj z selektorami.

BaN

8.10.2010, 22:32:42

Cytat(stefik4 @ 8.10.2010, 19:33:32 )

Właśnie nie wiem zbytnio jak to zrobić an klasach ;/

napisał już o tym @skowron-line, ale widzę, że jesteś zupełnie początkujący

dodajesz jakiś identyfikator do tabelki:

[HTML] pobierz, plaintext 
<table id="tabelka">
[HTML] pobierz, plaintext

w wierszach gdzie masz juniorów robisz:

[HTML] pobierz, plaintext 
<tr class="junior">...</tr>
[HTML] pobierz, plaintext

podobnie w wierszach gdzie masz seniorów:

[HTML] pobierz, plaintext 
<tr class="senior">...</tr>
[HTML] pobierz, plaintext

funkcja JS:

[HTML] pobierz, plaintext 
function show(co){
  var tabelka=document.getElementById('tabelka');
  var wiersze=tabelka.getElementsByName('tr');
  for(var i=0, n=wiersze.length; i<n; ++i){
    wiersze[i].style.border=(wiersze[i].className==co) ? '2px dotted #24c3d1' : '0px dotted #24c3d1';
  }
}
[HTML] pobierz, plaintext

no i oczywiście zmieni się wywołanie tych funkcji na odpowiednio:

[HTML] pobierz, plaintext 
<a href="#" onclick="show('junior');return false">Pokaż juniorów</a>
<a href="#" class="black_buttons" onclick="show('senior');return false">Pokaż seniorów</a>
[HTML] pobierz, plaintext

Cytat(stefik4 @ 8.10.2010, 19:33:32 )

// moga byc od 0, bo w tych liniach tr id tez mam od 0. Nadal nie wiem jak zrobic element.getdocument by class ;/

Poprawiłeś po moim wpisie

ale identyfikatory na wierszach nie są potrzebne

erix

8.10.2010, 22:50:10

[JAVASCRIPT] pobierz, plaintext 
 var wiersze=tabelka.getElementsByName('tr');
[JAVASCRIPT] pobierz, plaintext

Na pewno?

BaN

8.10.2010, 23:07:17

Cytat(erix @ 8.10.2010, 23:50:10 )

[JAVASCRIPT] pobierz, plaintext 
 var wiersze=tabelka.getElementsByName('tr');
[JAVASCRIPT] pobierz, plaintext

Na pewno?

Wiesz, że nie, trzeba było od razu poprawić

, w wierszu 3. powinno być:

[JAVASCRIPT] pobierz, plaintext 
 var wiersze=tabelka.getElementsByTagName('tr');
[JAVASCRIPT] pobierz, plaintext

erix

9.10.2010, 09:19:00

Od razu poprawiając nikt by nie ruszył głową w celu poszerzenia swoich wiadomości.

kamil4u

9.10.2010, 11:12:54

Cytat

wiersze[i].className==co

Tak się nie powinno robić, chyba, że jesteś pewien swoich klas. Powinno się spr. klasę używając właśnie indexOf . Bo co by było gdybyś miał np. class="test1 senior test2"

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.