Javascript倒计时问题

时间:2013-02-07 13:20:10

标签: javascript html

我设计了2页

由于某些未知原因,第二个没有刷新倒计时脚本,它只加载一次。

我尝试将javascript放在代码的不同位置,甚至从外部文件中调用它,但这只会完全打破倒计时脚本。

对于想要使用此倒计时javascript的任何人,请随时这样做。代码如下:

<script>

var timeout;

// Uncomment below to use one.
var reset = function() {
    //timeout = weekly(4, 12, 5); // 0=sunday, 6 = saturday
    //timeout = daily(2, 0, 0);
    timeout = new Date('25-Feb-2013');
}

var displayEndText = function() {
    end_day = timeout.getDay();
    end_date = timeout.getDate();
    end_month = timeout.getMonth();
    end_year = timeout.getFullYear();
    end_hour = timeout.getHours();

    var now = new Date();
    todays_midnight = new Date(now.getFullYear(), now.getMonth(), now.getDate() + 1);
    tomorrows_midnight = new Date(now.getFullYear(), now.getMonth(), now.getDate() + 2);

    dayText = "eek";
    timeText = "bar";

    a_p = "";
    if (end_hour < 12) {
        a_p = "AM";
    } else {
        a_p = "PM";
        end_hour -= 12;
    }
    end_min = timeout.getMinutes();
    if (end_min < 10) end_min = "0" + end_min;
    if ((end_hour == 0) && (end_min == 0)) {
        if (a_p == "AM") {
            timeText = "Midnight";
            var prevDay = new Date(timeout.getFullYear(), timeout.getMonth(), timeout.getDate() - 1);
            end_day = prevDay.getDay();
            end_date = prevDay.getDate();
        } else {
            timeText = "Midday";
        }
    } else {
        timeText = end_hour + ":" + end_min +" " + a_p;
    }

    if (timeout <= todays_midnight) {
        if ((end_hour == 0) && (end_min == 0)) {
            dayText = "";
        } else {
            dayText = "Today";
        }
    } else if (timeout <= tomorrows_midnight) {
        dayText = "Tomorrow";
    } else {
        d_names = new Array("Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday");
        m_names = new Array("January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December");
        var sup;
        switch (end_date) {
        case 1: 
        case 21:
        case 31: 
            sup = "st"; 
            break;
        case 2:
        case 22: 
            sup = "nd"; 
            break;
        case 3:
        case 23:
            sup = "rd";
            break;
        default:
            sup = "th";
        }
        dayText = d_names[end_day] + " " + end_date + "<SUP>" + sup + "</SUP> "
    }
    //document.getElementById('ed').innerHTML = d_names[end_day] + " " + end_date + "<SUP>" + sup + "</SUP> " + m_names[end_month] + " " + end_year + " at " + end_hour + " : " + end_min + " " + a_p;

    document.getElementById('ed').innerHTML = dayText + " at " + timeText;
}


var display = function () {
    var now = new Date();
    var secondsToGo = Math.ceil((timeout - now) / 1000);
    if (secondsToGo < 0) {
        reset();
        secondsToGo = Math.ceil((timeout - now) / 1000);
        window.location = "http://modeliving.co.uk/index1.php";
    }
    var secs = Math.floor(secondsToGo % 60);
    var minutesToGo = Math.floor(secondsToGo / 60);
    var mins = Math.floor(minutesToGo % 60);
    var hoursToGo = Math.floor(minutesToGo / 60);
    var hours = hoursToGo % 24;
    var daysToGo = Math.floor(hoursToGo / 24);

    if (secs < 10) secs = "0" + secs;
    if (mins < 10) mins = "0" + mins;
    if (hours < 10) hours = "0" + hours;    

    document.getElementById('cdDays').innerHTML = daysToGo;
    document.getElementById('cdHours').innerHTML = hours;
    document.getElementById('cdMins').innerHTML = mins;
    document.getElementById('cdSecs').innerHTML = secs;
    // document.getElementById('cdAll').innerHTML = daysToGo + ' days ' + hours + ' hours ' + mins + ' minutes ' + secs + ' seconds';

    displayEndText();
}

var weekly = function(dow, hour, min) {
    if (typeof(dow)==='undefined') dow = 1; // sunday midnight
    if (typeof(hour)==='undefined') hour = 0;
    if (typeof(min)==='undefined') min = 0;
    //dow = dow % 7;
    var now = new Date();
    var daysToGo = dow - now.getDay();
    if (daysToGo < 0) daysToGo += 7;
    if ((daysToGo == 0) && ((now.getHours()*60 + now.getMinutes()) >= (hour*60 + min))) daysToGo = 7;
    var result = new Date(now.getFullYear(), now.getMonth(), now.getDate()+daysToGo, hour, min, 0, 0);
    return result;
}

var daily = function(every, hour, min) {
    if (typeof(every)==='undefined') every = 2; // every 2 days
    if (typeof(hour)==='undefined') hour = 0;
    if (typeof(min)==='undefined') min = 0;
    var now = new Date();
    var daysToGo = Math.floor(((now - 0) / 1000 / 60 / 60 / 24) % every);
    if ((daysToGo == 0) && ((now.getHours()*60 + now.getMinutes()) >= (hour*60 + min))) daysToGo = every;
    var result = new Date(now.getFullYear(), now.getMonth(), now.getDate()+daysToGo, hour, min, 0, 0);
    return result;
}

reset();
display();
setInterval(display, 1000);

</script>

然后将其添加到html:

<div id="cdDays"></div>
<div id="cdHours"></div>
<div id="cdMins"></div>
<div id="cdSecs"></div>

2 个答案:

答案 0 :(得分:0)

当我在浏览器中打开第二页并查看Javascript控制台时,我发现此行有错误:

document.getElementById('ed').innerHTML = dayText + " at " + timeText;

错误:

  

未捕获的TypeError:无法设置null

的属性'innerHTML'

这是在display函数中调用的函数,该函数在setTimeout函数之前调用。所以这个错误就是杀死了执行。修复错误,您应该全部设置。

答案 1 :(得分:0)

评论第178行并且它有效。您正在尝试访问不存在的id ='ed'的元素。