Soru bir tarihe nasıl geri sayılır


Birinin bana yardım edip edemeyeceğini merak ediyorum. Burada ve internette yorulmadan arama saatlerinden sonra jquery kullanarak basit bir geri sayım bulamıyorum. Herhangi bir tür eklentiyi bir tarihten geri sayım yapmak için basit bir jquery kodu kullanmak istemiyorum. Bu kodu aşağıda bulmayı başardım. Ancak bu kodu web siteme yerleştirirken bile hiçbir şey görünmez. Jquery.com'dan jquery dosyasını ekledim ve uygun divleri ekledim. counter Kimlik ve hiçbir şey. Herhangi biri, bir tarih formatını alan ve geri sayım döndüren bir işlevde basit bir geri sayımın nasıl yapılacağını açıklayabilir veya gösterebilirse, bu yardımdan memnuniyet duyarım.

var end = new Date('02/19/2012 10:1 AM');

    var _second = 1000;
    var _minute = _second * 60;
    var _hour = _minute * 60;
    var _day = _hour * 24;
    var timer;

    function showRemaining() {
        var now = new Date();
        var distance = end - now;
        if (distance < 0) {

            clearInterval(timer);
            document.getElementById('countdown').innerHTML = 'EXPIRED!';

            return;
        }
        var days = Math.floor(distance / _day);
        var hours = Math.floor((distance % _day) / _hour);
        var minutes = Math.floor((distance % _hour) / _minute);
        var seconds = Math.floor((distance % _minute) / _second);

        document.getElementById('countdown').innerHTML = days + 'days ';
        document.getElementById('countdown').innerHTML += hours + 'hrs ';
        document.getElementById('countdown').innerHTML += minutes + 'mins ';
        document.getElementById('countdown').innerHTML += seconds + 'secs';
    }

    timer = setInterval(showRemaining, 1000);

44
2018-02-17 20:44


Menşei


DIV'nizin "geri sayım" kimliğine ihtiyacı var, "karşı" değil. - Gregor
@ Yazan bir yazarak hata "sayaç" - bammab
Bana dinamik tarihle sorduğum sorudan bahseder misin? U sabit kod tarihi veriyor, dinamik tarih istiyorum - Khushbu_sipl


Cevaplar:


Bu normal bir javascript olarak çalışıyor.

<script>
var end = new Date('02/19/2012 10:1 AM');

    var _second = 1000;
    var _minute = _second * 60;
    var _hour = _minute * 60;
    var _day = _hour * 24;
    var timer;

    function showRemaining() {
        var now = new Date();
        var distance = end - now;
        if (distance < 0) {

            clearInterval(timer);
            document.getElementById('countdown').innerHTML = 'EXPIRED!';

            return;
        }
        var days = Math.floor(distance / _day);
        var hours = Math.floor((distance % _day) / _hour);
        var minutes = Math.floor((distance % _hour) / _minute);
        var seconds = Math.floor((distance % _minute) / _second);

        document.getElementById('countdown').innerHTML = days + 'days ';
        document.getElementById('countdown').innerHTML += hours + 'hrs ';
        document.getElementById('countdown').innerHTML += minutes + 'mins ';
        document.getElementById('countdown').innerHTML += seconds + 'secs';
    }

    timer = setInterval(showRemaining, 1000);
</script>
<div id="countdown"></div>

Çıktınız aşağıdaki gibi görünür: -

1 gün 9saat 3dakika 22secs


GÜNCELLEŞTİRME

İşlevleri Kullanma:

<script>

    CountDownTimer('02/19/2012 10:1 AM', 'countdown');
    CountDownTimer('02/20/2012 10:1 AM', 'newcountdown');

    function CountDownTimer(dt, id)
    {
        var end = new Date(dt);

        var _second = 1000;
        var _minute = _second * 60;
        var _hour = _minute * 60;
        var _day = _hour * 24;
        var timer;

        function showRemaining() {
            var now = new Date();
            var distance = end - now;
            if (distance < 0) {

                clearInterval(timer);
                document.getElementById(id).innerHTML = 'EXPIRED!';

                return;
            }
            var days = Math.floor(distance / _day);
            var hours = Math.floor((distance % _day) / _hour);
            var minutes = Math.floor((distance % _hour) / _minute);
            var seconds = Math.floor((distance % _minute) / _second);

            document.getElementById(id).innerHTML = days + 'days ';
            document.getElementById(id).innerHTML += hours + 'hrs ';
            document.getElementById(id).innerHTML += minutes + 'mins ';
            document.getElementById(id).innerHTML += seconds + 'secs';
        }

        timer = setInterval(showRemaining, 1000);
    }

</script>
<div id="countdown"></div>
<div id="newcountdown"></div>

Çıkış aşağıdaki gibi görünecektir: -

0gün 23saat 25dakika 8sn

1 gün 23saat 25dakika 8sn


106
2018-02-17 20:58



Tamam, yayınladığınız şey çalışıyor gibi görünüyor, neyi değiştirdiniz? - bammab
@bammab: Hiçbir değişiklik yapmadım. Sadece javascript'in altına yerleştirildi <Script> etiket ve <Div> dışarıda olduğu gibi .. - Siva Charan
@bammab: Sanırım kaçırmış olabilirsin İD veya başka bir şey.. - Siva Charan
teşekkür ederim. seni bir şeyle rahatsız edebilirsem. bunu bir işlev haline getirmemi söyleyeyim, böylece aynı anda 2 sayacı çalıştırabilir miyim? - bammab
@HungryDB Böylece zamanlayıcıyı durdurabilecek ve kaynakları temizleyebileceksiniz, - afaolek


Bu jQuery değil, JavaScript. Ama neyse...

Neredeyse anladın. Tek sorun şu ki var distance = end-now;. Olmalı:

var distance = end.getTime()-now.getTime();

Ayrıca kullanmamalısınız += üzerinde innerHTML. Bunun yerine, bir değişken kullanın (örnek: var output = "") ve buna ekleyin, ardından innerHTML sonunda.

Son olarak, kimliğinin div sahip olduğunuz kimliğe uyuyor getElementById.


6
2018-02-17 20:46



Gerçekten javascript'i jQuery olarak ifade eden insanların eğiliminden nefret etmeye başlıyorum ... tıpkı jquery gelmeden önce js ile hiçbir şey yapamayacağınız gibi. - Tim
+ = İnnerHTML'den kaçınmak için +1. - davidethell
@Kolink evet, bu çok iyi bir kod gibi görünmüyor. jquery çözümü bulabileceğim herhangi bir yer biliyor musun? - bammab