尽管AJAX重新加载，倒计时计时器仍然存在

Countdown Timers that Persist Despite AJAX Reload

本文关键字：倒计时 计时器 存在 加载 AJAX 新加载 尽管      更新时间：2023-09-26

目前我正在使用别人的基于js的倒计时计时器。当我获取计时器时，我只需将一个值附加到倒计时计时器的类中，如下所示:

PHP: 

 $rows = mysql_num_rows($result);
 for ($j = 0 ; $j < $rows ; ++$j){
 <span id="countdown'.($j+1).'">
 }

确保计时器的id唯一。

问题是，当我开始使用AJAX用计时器刷新页面的部分时，新的计时器不起作用，因为id不再是唯一的。

有什么办法吗?任何想法，如果有一个更简单的插件倒计时计时器?

我正在使用这里的计时器。http://andrewu.co.uk/clj/countdown/

有关于如何跟踪已经在使用的id的想法吗?

请参阅您参考的计时器文档中如何执行多个倒计时计时器的描述:http://andrewu.co.uk/clj/countdown/.

如果你要使用该代码并有多个计时器，那么你只需要使ID按照文档解释的那样连续编号，这样你就不会有任何ID冲突，这样计时器代码就可以找到你的每个计时器。

我不知道你的ajax代码对页面做了什么，但如果它也添加了一个新的计数器，它将不得不计算正确的ID是什么(下一个可用的顺序ID是什么)。

如果你不需要在同一页面中有多个计数器，那么我不确定为什么会有问题。只要确保ajax调用没有添加另一个计时器或任何冲突的id。

基于进一步讨论的附加信息:

首先，我不认为你正在使用的计数器代码可以动态处理添加的内容。它初始化页面完成加载时页面中出现的计数器。在那之后，它再也不会看到另一个计数器，不管你是否给它一个好的ID。因此，计数器代码必须修改以处理ajax添加的计数器。

第二，改变计数器代码中的CD_Init()函数来支持一个"寄存器"函数并不难，在这个函数中，你传递了任何你想作为计数器的对象的ID，而不是在连续的ID中循环寻找存在的东西。这对于一个计数器很好，但是对于N个计数器就有问题了。

第三，如果它现在拥有的"自动查找"功能出于某种原因(我不是一个粉丝)是有用的，那么我将把它更改为使用唯一的类名(因此多个对象都可以具有相同的HTML并被启用为计数器)，并且我将添加一个ReInit()函数，人们可以调用该函数在动态内容添加到页面后重新扫描具有该类名的对象。

如果您需要在较旧的浏览器中按类名查找元素(这些浏览器本身不支持该功能)，那么有许多方法可以做到这一点。我个人使用Sizzle库，它检测函数是否内置并使用它，但如果不是，则退回到手工编码的方式。jQuery、YUI3和其他库都有自己的实现，或者在内部使用Sizzle实现。

相关文章：