Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [JavaScript] jquery next() Wyświetlanie kolejnego diva
Forum PHP.pl > Forum > Przedszkole
arzach
21.08.2011, 08:56:02
Witam mam taki kod
Kod
<html>
    <head>
        <title>jquery</title>
        <script type="text/javascript" src="jquery.js"></script>
        <script type="text/javascript">
            $(document).ready(function(){
              
              $('#next_match').click(function() {
                $('div').next().show("slow");
                
              });
              
            });
        </script>
    </head>
    <body>
    
    <a id="next_match" href="#">Nastepny mecz</a> / <a id="previous_match" href="#">Poprzedni mecz</a>
    
    <div>test 1</div>
    <div style="display: none;">test 2</div>
    <div style="display: none;">test 3</div>
    <div style="display: none;">test 4</div>
    <div style="display: none;">test 5</div>
    <div style="display: none;">test 6</div>
    
    </body>
</html>


I chce zrobić że po kliknięciu w Nastepny mecz pojawia się następny div a poprzedni sie chowa i wszystko fajnie ale po kliknięciu w Nastepny mecz pojawiają sie wszystkie divy a nie następny. Proszę o pomoc.


Doszedłem do czegoś takiego
[JAVASCRIPT] pobierz, plaintext 
  1.             $(document).ready(function(){
  2.  
  3.               $('#next_match').click(function() {           
  4.                  $("div").eq(0).next().show("slow");
  5.                  $("div").eq(0).hide("slow");
  6.               });
  7.  
  8.             });
[JAVASCRIPT] pobierz, plaintext


Ale nie wiem jak pobrać eq bieżący element
sada
21.08.2011, 09:00:26 
[JAVASCRIPT] pobierz, plaintext 
  1.  <script type="text/javascript">
  2.             $(document).ready(function(){
  3.             aktual=$('div').first();  
  4.               $('#next_match').click(function() {
  5. 			 	 aktual.hide("slow");
  6.                 aktual=aktual.next().eq(0);
  7. 			    aktual.show("slow");
  8.  
  9.               });
  10.  
  11.             });
  12.         </script>
[JAVASCRIPT] pobierz, plaintext



ale co jak się lista skończy , trzeba kilka warunków lub dodać różne id do divów
arzach
21.08.2011, 09:13:52
To chyba na pewno nie zadziała
Kod
aktual=aktual.next().eq(0);


Wydaje mi się że trzeba zapisać do zmiennej element bieżący potem next wyświetlić następny a hide schować poprzedni i przy następny kliknięciu operować już na tej zmiennej ale nie wiem jak to zrobić proszę pomoc?

Może ktoś zna jakiś lepszy sposób ?
sada
21.08.2011, 09:18:20
napewno działa
Nie podpowiadam zanim nie sprawdzą kodu.
MÓGŁBYŚ chociaż wysilić się i sprawdzić.
arzach
21.08.2011, 09:20:57
Przecież sprawdzałem tak i nie działa
Pyzatym skoro za każdym razem jest aktual=aktual.next().eq(0); to jak może działać questionmark.gif?
sada
21.08.2011, 09:29:37
Nie wiem już jak z tobą rozmawiać , kod napewno działa tu masz link :

http://guitar.ly/d.php#

A może chodzi ci o to , że noe zrobiłem za ciebie z prev specool.gif


[JAVASCRIPT] pobierz, plaintext 
  1. <script type="text/javascript">
  2.             $(document).ready(function(){
  3.             aktual=$('div').first();  
  4.               $('#next_match').click(function() {
  5. 			 	 aktual.hide("slow");
  6.                 aktual=aktual.next().eq(0);
  7. 			    aktual.show("slow");
  8.  
  9.               });
  10.               $('#previous_match').click(function() {
  11. 			 	 aktual.hide("slow");
  12.                 aktual=aktual.prev().eq(0);
  13. 			    aktual.show("slow");
  14.  
  15.               });
  16.  
  17.             });
  18.         </script>
[JAVASCRIPT] pobierz, plaintext
arzach
21.08.2011, 09:38:58
Dobra nie denerwuj sory się źle sprawdziłem i działa. Ale jak teraz sprawdzić za pomocą if że jest ostatni element bo jak dojdzie do ostatniego i kliknę daje to nic się nie pojawia a powinno zatrzymać się na ostatnim elemencie tak samo gdy jest pierwszy element to kliknę w poprzedni to tez znika
sada
21.08.2011, 10:30:33 
[JAVASCRIPT] pobierz, plaintext 
  1.   $(document).ready(function(){
  2.             aktual=$('div').first();
  3. 			ostatni=$('div:last').index();
  4. 			pierwszy=$('div:first').index();
  5.  
  6.               $('#next_match').click(function() {
  7. 			 	 if (aktual.index() != ostatni ){
  8. 				 aktual.hide("slow");
  9.                 aktual=aktual.next().eq(0);
  10. 			    aktual.show("slow");
  11.                }
  12.               });
  13.  
  14.               $('#previous_match').click(function() {
  15.  
  16. 			   if (aktual.index() != pierwszy ){
  17. 			 	 aktual.hide("slow");
  18.                 aktual=aktual.prev().eq(0);
  19. 			    aktual.show("slow");
  20.                }
  21.               });
  22.  
  23.             });
[JAVASCRIPT] pobierz, plaintext
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.