Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
 Reply to this topicStart new topic
> [JavaScript]Nie działa skrypt JS
michuwsh
post
Post #1





Grupa: Zarejestrowani
Postów: 51
Pomógł: 0
Dołączył: 1.03.2016

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

Hej mam problem potrzebuje pobrać akapity o klasie "demo" do tablicy/obiektu policzyć ile występuje takich akapitów o klasie demo i wyświetlić każdy z osobna z 2 sekundowym timeoutem w pojemniku div o nazwie test. Ma to być coś na zasadzie slidera ale zamiast zdjęć ma zmieniać się tekst. Moj kod wygląda tak : 
[HTML] pobierz, plaintext 
  1.  
  2. <!doctype html>
  3.  
  4. <html lang="pl">
  5. <head>
  6.   <meta charset="utf-8">
  7.  
  8.   <title>Pierwszy test</title>
  9.   <meta name="description" content="The HTML5 Herald">
  10.   <meta name="author" content="SitePoint">
  11.  
  12.   <link rel="stylesheet" href="css/styles.css?v=1.0">
  13.  
  14.  
  15. </head>
  16.  
  17. <body>
  18.     <p class="demo">To jest pierwszy przykładowy tekst do js</p>
  19.     <p class="demo">To jest drugi przykładowy tekst do js</p>
  20.     <p class="demo">To jest trzeci przykładowy tekst do js</p>
  21.     <div id="test"></div>
  22.   <script>
  23.  
  24.     var x = document.getElementsByClassName("demo");
  25.     var liczba = x.length;
  26.     var i;
  27.       change();
  28.     function change() {
  29.         for (i=0; i < liczba; i++) {
  30.             var stan = x[i].innerHTML;
  31.             document.getElementById('test').innerHTML = stan;
  32.  
  33.         }
  34.         setTimeout(change, 2000);
  35.     }
  36.  
  37.   </script>
  38. </body>
  39. </html>
  40.  
[HTML] pobierz, plaintext
Go to the top of the page
+Quote Post
markuz
post
Post #2





Grupa: Zarejestrowani
Postów: 1 240
Pomógł: 278
Dołączył: 11.03.2008

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

Teraz co 2 sekundy podmieniasz treść diva o id test 3 razy - więc finalnie będziesz widział tylko treść ostatniego diva za każdym razem. Zmienną i musisz trzymać poza pętlą (tak jak jest obecnie) i zwiększać ją tylko raz (lub zmniejszać do 0) w funkcji change.
Go to the top of the page
+Quote Post
olszam
post
Post #3





Grupa: Zarejestrowani
Postów: 342
Pomógł: 23
Dołączył: 20.01.2011
Skąd: Chełm

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

[PHP] pobierz, plaintext 
  1. function change() {
  2.       var i=0;
  3.           setInterval(function(){
  4.             if(i<liczba){
  5.               var stan = x[i].innerHTML;
  6.               document.getElementById('test').innerHTML = stan;
  7.               i=i+1;
  8.             }else{
  9.               i = 0;
  10.               var stan = x[i].innerHTML;
  11.               document.getElementById('test').innerHTML = stan;
  12.               i=i+1;
  13.             }
  14.           }, 2000);
  15.  
  16.     }
[PHP] pobierz, plaintext

tą funkcję mógłbyś tak zmienić jeśli ci zależy na ciągłym wracaniu do początku
Go to the top of the page
+Quote Post
trueblue
post
Post #4





Grupa: Zarejestrowani
Postów: 6 806
Pomógł: 1828
Dołączył: 11.03.2014

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

To już prościej tak:
[HTML] pobierz, plaintext 
  1. function change() {
  2.       var i=0;
  3.           setInterval(function(){
  4.             if(i<liczba){
  5.               var stan = x[i].innerHTML;
  6.             }else{
  7.               var stan = x[0].innerHTML;
  8.               i=1;
  9.             }
  10.             i++;
  11.             document.getElementById('test').innerHTML = stan;
  12.           }, 2000);
  13. }
[HTML] pobierz, plaintext

albo wręcz tak:
[HTML] pobierz, plaintext 
  1. function change() {
  2.       var i=0;
  3.           setInterval(function(){
  4.             i %= liczba;
  5.             var stan = x[i++].innerHTML;
  6.             document.getElementById('test').innerHTML = stan;
  7.           }, 2000);
  8. }
[HTML] pobierz, plaintext
Go to the top of the page
+Quote Post
« Następny starszy · Przedszkole · Następny nowszy »
 

Reply to this topicStart new topic
2 Użytkowników czyta ten temat (2 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: 18.09.2025 - 08:10
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn