- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我为 WordPress 自定义插件创建了一个 JavaScript 倒计时。我读过this article这是我第一次尝试做类似的东西。在我写完代码后,我对其进行了测试,最初它运行良好。现在,如果我尝试在控制台中记录小时、分钟、天和秒的值,我会收到一条 NaN 消息。我不知道出了什么问题,有人可以帮助我吗?
<?php if( get_option('show-countdown') ): ?>
<div class="countdown">
<h1 class="days d-inline"></h1>
<h1 class="hours d-inline"></h1>
<h1 class="minutes d-inline"></h1>
<h1 class="seconds d-inline"></h1>
</div>
<script>
(function($){
$(document).ready(function(){
var date = '<?php echo get_option('countdown-timer'); ?>';
console.log(date);
function remainingTime( date ){
var countdown = Date.parse(date) - Date.parse(new Date());
var seconds = Math.floor( (countdown/1000) % 60 );
var minutes = Math.floor( (countdown/1000/60) % 60 );
var hours = Math.floor( (countdown/(1000*60*60)) % 24 );
var days = Math.floor( countdown/(1000*60*60*24) );
return {
'total': countdown,
'd': days,
'h': hours,
'm': minutes,
's': seconds
};
}
console.log(remainingTime(date));
function initClock( endtime ){
var timeinterval = setInterval(function(){
var t = remainingTime( endtime );
$('.days').html(t.d);
$('.hours').html(t.h);
$('.minutes').html(t.m);
$('.seconds').html(t.s);
}, 1000);
}
initClock( '.countdown', date );
});
}(jQuery));
</script>
<?php endif; ?>
</div>
最佳答案
问题在于您向 initClock
传递了两个参数,但方法签名只接受一个 (endTime
)。通过删除第一个参数(它似乎是未使用的 CSS 选择器字符串),问题得到解决:
(function($) {
$(document).ready(function() {
var date = '2030-01-01';
console.log(date);
function remainingTime(date) {
var countdown = Date.parse(date) - Date.parse(new Date());
var seconds = Math.floor((countdown / 1000) % 60);
var minutes = Math.floor((countdown / 1000 / 60) % 60);
var hours = Math.floor((countdown / (1000 * 60 * 60)) % 24);
var days = Math.floor(countdown / (1000 * 60 * 60 * 24));
return {
'total': countdown,
'd': days,
'h': hours,
'm': minutes,
's': seconds
};
}
console.log(remainingTime(date));
function initClock(endtime) {
var timeinterval = setInterval(function() {
var t = remainingTime(endtime);
$('.days').html(t.d);
$('.hours').html(t.h);
$('.minutes').html(t.m);
$('.seconds').html(t.s);
}, 1000);
}
initClock(date);
});
}(jQuery));
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="countdown">
<h1 class="days d-inline"></h1>
<h1 class="hours d-inline"></h1>
<h1 class="minutes d-inline"></h1>
<h1 class="seconds d-inline"></h1>
</div>
注意:由于这主要与 JavaScript 有关,因此我删除了 PHP 条件并硬编码了一个日期值来代替 get_option
调用。
关于javascript - NaN 倒计时器 JavaScript,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59738619/
我想在 android 中扫描黑底白字条码。我使用过 zxing,它允许我只扫描白底黑字。我如何扫描和倒置条形码或使用哪个库?感谢您的帮助。 最佳答案 如果您仍在引用 journeyapps 嵌入式
所以我在 youtube 上观看了一些介绍性类(class)以学习 OpenGL 的基础知识并学习了诸如制作三角形和简单相机类等内容。我一直想尝试制作体素引擎,这显然是第一个我想做的是一个我最终可以复
这个问题在这里已经有了答案: Div with cut out edges, border and transparent background (6 个答案) 关闭 8 年前。
我有一张图片,我正在查看用 HTML 创建的小型网站的基本定制。 我知道您可以对图像进行倒 Angular 处理,如 this question here 中所示,这给出了 45 度切割。 我希望每个
我必须在 iOS 上创建一个自定义形状(倒 T)边框的 Uiview。我附上下面的截图。我进行了很多研究,找到了一种使用 here 中的 UIBezierPath 的方法. 但我不知道如何将我的 Vi
我是一名优秀的程序员,十分优秀!