Kilka odliczań do wydarzenia na jednej stronie

0

Cześć. Jak w/w temacie. Zbudowałem stronkę do wydarzeń w moim mieście no i chciałem umieścić na niej odliczanie czasu do kilku wydarzeń. Do jednego wydarzenia to nie problem, masa jest tego w necie problem pojawią się jeśli chcę mieć ich kilka, bezsensu byłoby kopiowanie kodu tak więc próbowałem coś pokombinować wyszło mi coś takiego i za nic nie umiem dojść gdzie co namotałem, o czym zapomniałem że to nie działa, moglibyście spojrzeć i na nieść ewentualnie w miarę wolnego czasu i chęci poprawki? Z góry dziękuję.

timer.js

$('[data-countdown]').each(function() { "use strict" ;
  var $this = $(this), finalDate = $(this).data('countdown');
  $this.countdown(finalDate, function(event) { 
	    $(".days").text(event.strftime("%-d"));
        $(".hours").text(event.strftime("%H"));
        $(".minutes").text(event.strftime("%M"));
        $(".seconds").text(event.strftime("%S"));
      });
});

HTML


<script src="jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="js/Timer.js"></script>	
</head>

<body>
<div data-countdown="2019/01/01 20:00:00">

  <div class="days" data-countdown="2019/01/01 20:00:00""><span>dni</span></div>

  <div class="hours"><span>godzin</span></div>

  <div class="minutes"><span>minut</span></div>

  <div class="seconds"><span>sekund</span></div>

</div>

</body>
0
  1. Masz popsuty HTML, 2x definiujesz "komponent" z data-countdown
  2. Wybieranie po $(".days") itp w funkcji zmieni zawartość wszystkich elementów z taką klasą, a nie tylko nadrzędnego, bo szukasz po całym DOM, a nie dałeś ograniczenia na element rodzica. W efekcie wszystkie liczniki będą działać jak ostatni.

Tip: Odpuść sobie dni, godzin, minut, sekund w HTMLu i wypisuj to z JSa. W HTMLu będziesz miał jeden prosty div, a i tak musisz to z JSa pisać, żeby móc odmieniać słowa "5 godzin" i "1 godzina".

0

Tak masz rację, muszę to poprawić z tym ograniczeniem dam rade gorzej z tą odmianą ale poszukam w necie.
Natomiast mam inny problem , chcę najpierw to uruchomić u siebie. Dałem ten kod na jsfiddle.net i działa na tej samej bibliotece jQuery co u mnie. Piszę ten kod w dreamweaver i w bibliotece wyświetla błędy szczególnie w kilku miejscach by pozamieniać "==" na "===" lub "!=" na "!==" i wiele innych biblioteka jest ściągnięta ze strony jQuery, dokładnie to najnowsza 3.2.1. Nie wierze by było tam tyle błędów, nie wiem dlaczego tak pokazuje, Po prostu szukam rozwiązania dlaczego on line kod działa a u mnie nie. Ścieżki do plików mam prawidłowe. Jest tam literówka o jeden cudzysłów za dużo w htmlu wyżej w kodzie, ale to już poprawiłem poza tym nie wiem dlaczego to nie działa. Czegoś mi musi brakować, tylko czego ?

1 użytkowników online, w tym zalogowanych: 0, gości: 1