Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: zmiana klasy wiersza
Forum PHP.pl > Forum > Po stronie przeglądarki
AxZx
19.02.2006, 21:13:41
witam

temat ukrywanie/pokazywania elementow byl juz poruszany, ale niestety ja nie umiem skorzystac z tego co znalazlem,


[HTML] pobierz, plaintext 
  1. <table>
  2.  <tr class="nad0">
  3.   <td>1 <img src="jakis.jpg"></td>
  4.   <td>wiersz 1</td>		
  5.  </tr>
  6.  <tr class="ukryty nad1">
  7.   <td>2</td>
  8.   <td>wiersz 2</td>
  9.  </tr>
  10.  <tr class="ukryty nad1">
  11.   <td>3</td>
  12.   <td>wiersz 3</td>
  13.  </tr>
  14.  <tr class="ukryty nad1">
  15.   <td>4</td>
  16.   <td>wiersz 4</td>
  17.  </tr>
  18.  <tr class="nad0">
  19.   <td>5</td>
  20.   <td>wiersz 5</td>
  21.  </tr>
  22. </table>
[HTML] pobierz, plaintext


<tr> z klasa ukryty jest niewidoczny, chcialbym aby po kliknieciu <img> wszystkie <tr> z klasa nad1 zmienily klase na widoczny nad1
ale gdy jest juz <tr class="widoczny nad1"> to zeby zmienilo sie spowrotem na <tr class="ukryty nad1">
i tak na przemian

da sie to jakos zrobic?
bede wdzieczny za pomoc
pozdrawiam
anopak
20.02.2006, 09:22:35
zainteresuje się frameworkiem: Prototype

i robisz to mniej więcej tak (pisane z palca, nie gwarantuje, że działa)

Kod
function imgClick(){
  allTr=$('ID_TABELI').getElementsByTagName('tr');

  for(i=0;i<allTr.length;i++){
    if(Element.hasClassName(allTr[i],'nad1')){
      if(Element.hasClassName(allTr[i],'widoczny')||
          !Element.hasClassName(allTr[i],'ukryty')){
        Element.removeClassName(allTr[i],'widoczny');
        Element.addClassName(allTr[i],'ukryty');
      }
      else{
        Element.removeClassName(allTr[i],'ukryty');
        Element.addClassName(allTr[i],'widoczny');
      }
    }
  }
}


ale, jezeli chcesz poprostu zmieniać widoczność wszystkich elementów, które mają klasę nad1, to proponuję w ten sposób:

Kod
function imgOnClick(){
allNad=document.getElementsByClassName('nad1');
for(i=0;i<allNad.length;i++)
  Element.toggle(allNad[i]);
}


krótsze i czytelniejsze...
AxZx
20.02.2006, 09:45:30
a moglbys pomoc mi rozwinac ten drugi sposob?
albo chociaz objasnic

wymyslilem ze wiersz bedzie mial taki atrybut class="ukryty nad1"
po kliknieciu obrazka ten wiersz zmienia atrybut na class="widoczny nad1"
po ponownym kliknieciu zmienia na class="ukryty nad1"

chyba ze jest jakis sposob zeby nie bylo tej pierwszej klasy ukryty/widoczny


EDIT
dziala smile.gif
Kod
function getElementsByClassName(class_name)
{
  var all_obj,ret_obj=new Array(),j=0,teststr;

  if(document.all)all_obj=document.all;
  else if(document.getElementsByTagName && !document.all)
    all_obj=document.getElementsByTagName("*");

  for(i=0;i<all_obj.length;i++)
  {
    if(all_obj[i].className.indexOf(class_name)!=-1)
    {
      teststr=","+all_obj[i].className.split(" ").join(",")+",";
      if(teststr.indexOf(","+class_name+",")!=-1)
      {
        ret_obj[j]=all_obj[i];
        j++;
      }
    }
  }
  return ret_obj;
}

function ShowHide(klasa) {
    
    obj = getElementsByClassName(klasa);
    
    for(i=0;i<obj.length;i++){
  if(obj[i].className == 'ukryty ' + klasa){
      obj[i].className = 'widoczny ' + klasa;
  }else{
      obj[i].className = 'ukryty ' + klasa;
  }
    }
    
    
}


EDIT
a teraz inny problem
chcialbym aby ten obrazek w ktory klikam zmienial sie po kliknieciu
da sie zmienic src obrazka w zdarzeniu onclick?
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.