Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
 Reply to this topicStart new topic
> [JavaScript]Zaznaczanie wiersza tabeli
lubiemdziem
post
Post #1





Grupa: Zarejestrowani
Postów: 28
Pomógł: 0
Dołączył: 13.06.2008

Ostrzeżenie: (0%)
-----

Witam, jestem kompletnym laikiem w JS. Znalazłem skrypt na zaznaczanie wiersza, tylko, że nie działa tak jak chcę. Chcę zaznaczać wiele wierszy na raz (spoko, to łatwe. Wywalić funkcję clearSelection), ale jak odznaczyć wiersz po ponownym kliknięciu?


Tu kod:

[HTML] pobierz, plaintext 
  1. <html>
  2. <head>
  3.  
  4. <style type="text/css">
  5. .highlight {
  6.   background:red;
  7. }
  8. </style>
  9.  
  10. <script type="text/javascript">
  11. var selectedClass='highlight';
  12. var selectedRow=null;
  13. function selectRow(row){
  14.          clearSelection();
  15.          row.className += " "+selectedClass;
  16.          selectedRow=row;
  17.  
  18. }
  19. function clearSelection(){
  20.         var reg = new RegExp('(\\s|^)'+selectedClass+'(\\s|$)');
  21.         if(selectedRow!=null)  selectedRow.className=selectedRow.className.replace(reg,' ');
  22. }
  23. </script>
  24.  
  25. <title>Table</title>
  26.  
  27. </head>
  28. <body>
  29.  
  30.  <table>
  31.   <tr onClick="selectRow(this)"><td>1</td><td>2</td></tr>
  32.   <tr onClick="selectRow(this)"><td>3</td><td>4</td></tr>
  33.   <tr onClick="selectRow(this)"><td>5</td><td>5</td></tr>
  34.   <tr onClick="selectRow(this)"><td>6</td><td>7</td></tr>
  35. </table>
  36.  
  37. </body>
  38. </html>
[HTML] pobierz, plaintext



Pozdrawiam.
Go to the top of the page
+Quote Post
kamil4u
post
Post #2





Grupa: Zarejestrowani
Postów: 2 350
Pomógł: 512
Dołączył: 4.01.2009
Skąd: Wrocław / Świdnica

Ostrzeżenie: (0%)
-----

Chcesz gotowca czy trochę pomyśleć i sam to zrobić? - pytam, bo nie wiem czy mam opisywać wszystko krok po kroku czy po prostu dać Ci gotowy kod.
O jeszcze takie pytanie: w całości rozumiesz powyższy kod?

Praktycznie wszystko masz napisane. Wystarczy trochę przekopiować/pozamieniać i będzie gitara smile.gif


--------------------
>>> iPage.pl - JS, HTML5, CSS3, Android - moja oferta
>>> myPrzepis.pl - blog kulinarny
Go to the top of the page
+Quote Post
lubiemdziem
post
Post #3





Grupa: Zarejestrowani
Postów: 28
Pomógł: 0
Dołączył: 13.06.2008

Ostrzeżenie: (0%)
-----

Szczerze to nie rozumiem niczego.

Wolę gotowy kod, bo i tak JS to dla mnie czarna magia. Dziękuję slicznie z góry, dam punkt pomógł biggrin.gif
Go to the top of the page
+Quote Post
kamil4u
post
Post #4





Grupa: Zarejestrowani
Postów: 2 350
Pomógł: 512
Dołączył: 4.01.2009
Skąd: Wrocław / Świdnica

Ostrzeżenie: (0%)
-----

W sumie lepiej, bo zaoszczędziłeś mi czasu na wyjaśnianie wszystkiego. Chociaż ostatnio mało kto na forum chce się czegoś nauczyć - z reguły chcą gotowca. No nic.

[HTML] pobierz, plaintext 
  1.     <html>
  2.     <head>
  3.  
  4.     <style type="text/css">
  5.     .highlight {
  6.     background:red;
  7.     }
  8.     </style>
  9.  
  10.     <script type="text/javascript">
  11.     var selectedClass='highlight';
  12.     var selectedRow=null;
  13.  
  14.     function selectRow(row){
  15.     if( row.className.indexOf(selectedClass) != -1 )
  16.      clearSelection( row );
  17.     else{
  18.      clearSelection( selectedRow);
  19.  
  20.     row.className += " "+selectedClass;
  21.     selectedRow=row;
  22.      }
  23.     }
  24.     function clearSelection( row ){
  25.     var reg = new RegExp('(\\s|^)'+selectedClass+'(\\s|$)');
  26.     if(selectedRow!=null) row.className=row.className.replace(reg,' ');
  27.     }
  28.     </script>
  29.  
  30.     <title>Table</title>
  31.  
  32.     </head>
  33.     <body>
  34.  
  35.     <table>
  36.     <tr onClick="selectRow(this)"><td>1</td><td>2</td></tr>
  37.     <tr onClick="selectRow(this)"><td>3</td><td>4</td></tr>
  38.     <tr onClick="selectRow(this)"><td>5</td><td>5</td></tr>
  39.     <tr onClick="selectRow(this)"><td>6</td><td>7</td></tr>
  40.     </table>
  41.  
  42.     </body>
  43.     </html>
[HTML] pobierz, plaintext


--------------------
>>> iPage.pl - JS, HTML5, CSS3, Android - moja oferta
>>> myPrzepis.pl - blog kulinarny
Go to the top of the page
+Quote Post
lubiemdziem
post
Post #5





Grupa: Zarejestrowani
Postów: 28
Pomógł: 0
Dołączył: 13.06.2008

Ostrzeżenie: (0%)
-----

Dzięki mistrzu smile.gif


Co do uczenia się zasady działania skryptów nie mam zwyczajnie czasu. Wiem, smutne to, ale czasem trzeba i tak
Go to the top of the page
+Quote Post
« Następny starszy · Przedszkole · Następny nowszy »
 

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 

Tryb wyświetlania: Standardowy · Przełącz na: Linearny+ · Przełącz na: Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Aktualny czas: 22.08.2025 - 00:28
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn