倒计时;不起作用
Countdown doesn't work
我是JavaScript的初学者。我想做一个真正的极简倒计时,我发现了这个脚本:http://codepen.io/scottobrien/pen/Fvawk
但当我尝试用我的设置自定义它时,什么也没发生。
谢谢你的帮助。
这是我的代码
<ul class="countdown">
<li>
<span class="days"></span>
<p class="timeRefDays"></p>
</li>
<li>
<span class="hours"></span>
<p class="timeRefHours"></p>
</li>
<li>
<span class="minutes"></span>
<p class="timeRefMinutes"></p>
</li>
<li>
<span class="seconds"></span>
<p class="timeRefSeconds"></p>
</li>
</ul>
(function($) {
$.fn.countdown = function(options, callback) {
//custom 'this' selector
var thisEl = $(this);
//array of custom settings
var settings = {
'date': 7 May 2012 17:30:00;
'format': on
};
//append the settings array to options
if(options) {
$.extend(settings, options);
}
//main countdown function
function countdown_proc() {
var eventDate = Date.parse(settings['date']) / 1000;
var currentDate = Math.floor($.now() / 1000);
if(eventDate <= currentDate) {
callback.call(this);
clearInterval(interval);
}
var seconds = eventDate - currentDate;
var days = Math.floor(seconds / (60 * 60 * 24)); //calculate the number of days
seconds -= days * 60 * 60 * 24; //update the seconds variable with no. of days removed
var hours = Math.floor(seconds / (60 * 60));
seconds -= hours * 60 * 60; //update the seconds variable with no. of hours removed
var minutes = Math.floor(seconds / 60);
seconds -= minutes * 60; //update the seconds variable with no. of minutes removed
//conditional Ss
if (days == 1) { thisEl.find(".timeRefDays").text(""); } else { thisEl.find(".timeRefDays").text(""); }
if (hours == 1) { thisEl.find(".timeRefHours").text(""); } else { thisEl.find(".timeRefHours").text(""); }
if (minutes == 1) { thisEl.find(".timeRefMinutes").text("Minute"); } else { thisEl.find(".timeRefMinutes").text("Minutes"); }
if (seconds == 1) { thisEl.find(".timeRefSeconds").text("Second"); } else { thisEl.find(".timeRefSeconds").text("Seconds"); }
//logic for the two_digits ON setting
if(settings['format'] == "on") {
days = (String(days).length >= 2) ? days : "0" + days;
hours = (String(hours).length >= 2) ? hours : "0" + hours;
minutes = (String(minutes).length >= 2) ? minutes : "0" + minutes;
seconds = (String(seconds).length >= 2) ? seconds : "0" + seconds;
}
//update the countdown's html values.
if(!isNaN(eventDate)) {
thisEl.find(".days").text(days);
thisEl.find(".hours").text(hours);
thisEl.find(".minutes").text(minutes);
thisEl.find(".seconds").text(seconds);
} else {
alert("Invalid date. Here's an example: 12 Tuesday 2012 17:30:00");
clearInterval(interval);
}
}
//run the function
countdown_proc();
//loop the function
interval = setInterval(countdown_proc, 1000);
}
}) (jQuery);
//Call countdown plugin
$(".countdown").countdown({
date: "7 May 2014 6:19:00", // add the countdown's end date (i.e. 3 november 2012 12:00:00)
format: "on" // on (03:07:52) | off (3:7:52) - two_digits set to ON maintains layout consistency
},
function() {
// the code here will run when the countdown ends
alert("done!")
});
在我的情况下,它的工作方式与类似
$(document).ready(function(){
$("#countdown").countdown({
date: "10 30 2015 12:00:00", // m d y and time
format: "on"
})
});
此处更改:
var settings = {
'date': '7/5/2012 17:30:00';
'format': 'd-m-y'
};
也在这里:
$(".countdown").countdown({
date: "7/5/2012 17:30:00", // add the countdown's end date (i.e. 3 november 2012 12:00:00)
format: "d-m-y" // on (03:07:52) | off (3:7:52) - two_digits set to ON maintains layout consistency
}
相关文章:
- electronic BrowserWindow的最小高度和宽度在hide()show()方法之后不起作用
- 监视函数从服务返回不起作用,但作用域函数起作用
- 幻灯片滚动javascript不起作用
- 简单的javascript在Shopify中不起作用
- Recaptcha在IE7和IE8中不起作用
- Ember Data DS.Model's set函数不起作用
- JsFiddle上的鼠标事件不起作用
- 我的AngularJS表达式没有'不起作用
- 点击按钮输入不起作用
- 面向对象的Javascript代码在IE7中不起作用
- 分部隐藏在jquery中不起作用
- 倒计时不起作用
- 倒计时在某些情况下不起作用
- 在javascript中使用PHP时间字符串后,倒计时不起作用
- 精灵图像的背景位置在 IE 中不起作用,用于倒计时时钟
- jquery 倒计时服务器同步不起作用
- 倒计时不起作用 jquery
- jquery倒计时字符在IE中不起作用
- jquery不起作用的倒计时
- 倒计时;不起作用