Question

当我们在Meteor中更新时，jquery中的倒计时器没有更新。函数写在helper中。请找到下面的代码。

var countdown =  setInterval(function()
        {
            $("#getting-started" + id).countdown(newdate, function (event) 
            {
                if (Number(event.strftime('%D')) < 2) {
                    $("#getting-started" + id).addClass('timerred');
                }
                else {
                    $("#getting-started" + id).addClass('timergreen');
                }

                $("#getting-started" + id).text
                (
                    event.strftime('%D days %H:%M:%S')
                );
            });
        }, 1000);

Answer 1

您需要了解的是，将此代码代码放在帮助程序中是不可靠的，因为它可以轻松地重新运行。

将代码放在document.ready中也行不通，因为meteor处理模板的方式。

如果您依赖于特定模板中的DOM，那么确保它存在的唯一方法是将代码放入rendered回调中。

假设你有这样的模板：

<template name="countdown">
    <div id="clock"></div>
</template>

您提供的代码应该位于此模板的渲染回调中，因此：

Template.countdown.rendered = function() {
//initiate the clock... and then
    var countdown =  setInterval(function()
        {
            $("#getting-started" + id).countdown(newdate, function (event) 
            {
                if (Number(event.strftime('%D')) < 2) {
                    $("#getting-started" + id).addClass('timerred');
                }
                else {
                    $("#getting-started" + id).addClass('timergreen');
                }

                $("#getting-started" + id).text
                (
                    event.strftime('%D days %H:%M:%S')
                );
            });
        }, 1000);
}

另一个提示：如果你使用相同的选择器来获取jquery对象（“＃getting-started”+ id）执行一次，并分配给局部变量，它会更快，因为你不会遍历DOM每次。

流星倒计时器jquery没有更新

1 个答案: