我正在使用jQuery计时器( jQuery计时器插件)在一个页面上设置多个计时器.当用户单击启动按钮时,它应该停止并删除以前的任何计时器(即使它本身已经启动),并以原来的6秒间隔启动一个新计时器.
I'm using jQuery Timers (jQuery Timers plugin) to set multiple timers on a page. When the user clicks a start button, it should stop and remove any previous timer, even if it started itself, and start a new one with the original interval of 6 seconds.
我遇到的问题是该功能将停止原始计时器但不会将其删除,并且当另一个计时器使用相同的标签启动时,我最终会遇到两个带有相同标签的计时器不同步的情况.
The problem I'm having is that the function will stop the original timer but not remove it and when another timer starts up with the same label, I end up having two timers with the same label running out of sync.
对此有任何见识将不胜感激.
Any insight into this would be appreciated.
六个字母应类似以下内容才能正常工作:
Six should read like the following for it to work correctly:
\ 6. #timer02停止,数据02隐藏,#timer01以新时间重启,显示剩余时间,显示数据01.
\6. #timer02 stops, data 02 hides, #timer01 restarts with new time, displays new time remaining, shows data 01.
<script src="javascript/jquery.min.js" type="text/javascript"></script> <script src="javascript/jquery.timers.js" type="text/javascript"></script> <script src="javascript/jquery.countdown.min.js" type="text/javascript"></script> <script> $(function(){ $("#preview01, #preview02, p.msg").hide(); $("#timer01").click(function(){ $("#preview01, #preview02, p.msg").fadeOut("slow"); $("#timer01").stopTime("#timer01"); $('p.countdown span').countdown({seconds: 5}); $("#timer01").oneTime(6000, function(){ $("#preview01").slideUp("slow"); $("p.msg").text("time's up 1").show(); }); $("#preview01").slideDown("slow"); }); $("#timer02").click(function(){ $("#preview01, #preview02, p.msg").fadeOut("slow"); $("#timer01").stopTime("#timer01"); $('p.countdown span').countdown({seconds: 5}); $("#timer02").oneTime(6000, function(){ $("#preview02").slideUp("slow"); $("p.msg").text("time's up 2").show(); }); $("#preview02").slideDown("slow"); }); }) </script>HTML:
<ul> <li><a href="#" id="timer01">Timer One Start</a></li> <li><a href="#" id="timer02">Timer Two Start</a></li> </ul> <p class="countdown"> <span></span> seconds left. </p> <p class="msg"> </p> <div id="preview01"> <ul> <li>One</li> <li>Two</li> <li>Three</li> <li><a href="#" class="stop">Timer Stop</a></li> </ul> </div><!-- #preview --> <div id="preview02"> <ul> <li>Four</li> <li>Five</li> <li>Six</li> <li><a href="#" class="stop">Timer Stop</a></li> </ul> </div>推荐答案
所以我发现基于通用标签而不是使用标签来停止计时器效果最好.
So I figured out that stopping the timers based on the generic tag versus using the label worked best.
//stop timers $("#timer01, #timer02").click(function(){ $("a").stopTime(); $("p.countdown span").remove(); });更多推荐
停止和删除jQuery计时器
发布评论