jquery：秒表

我正在使用我在这里找到的stopwatch代码： http ： //www.kellishaver.com/projects/stopwatch/

 (function($) { $.fn.stopwatch = function() { var clock = this; var timer = 0; clock.addClass('stopwatch'); //console.log(clock); // This is bit messy, but IE is a crybaby and must be coddled. clock.html('
00:00:00
'); clock.append(''); clock.append(''); clock.append(''); //console.log(clock.html()); // We have to do some searching, so we'll do it here, so we only have to do it once. var h = clock.find('.hr'); var m = clock.find('.min'); var s = clock.find('.sec'); var start = clock.find('.start'); var stop = clock.find('.stop'); var reset = clock.find('.reset'); stop.hide(); start.bind('click', function() { timer = setInterval(do_time, 1000); stop.show(); start.hide(); }); stop.bind('click', function() { clearInterval(timer); timer = 0; start.show(); stop.hide(); }); reset.bind('click', function() { clearInterval(timer); timer = 0; h.html("00"); m.html("00"); s.html("00"); stop.hide(); start.show(); }); function do_time() { // parseInt() doesn't work here... hour = parseFloat(h.text()); minute = parseFloat(m.text()); second = parseFloat(s.text()); second++; if(second > 59) { second = 0; minute = minute + 1; } if(minute > 59) { minute = 0; hour = hour + 1; } h.html("0".substring(hour >= 10) + hour); m.html("0".substring(minute >= 10) + minute); s.html("0".substring(second >= 10) + second); } }; })(jQuery); 

我这样使用它：

  $('#clock1').stopwatch();  

它工作正常，我可以使用停止按钮停止它。 但是我希望能够使用javascript以编程方式停止它。 像这样的东西：

  $('#clock1').stop();  

我创建了stop函数，但是我无法访问在stopwatch()定义的timer var。 我该怎么做？

Answer 1

您可以在代码中添加一个小API并使用$.data附加它：

 var api = { stop: function() { stop.click(); // this should probably be improved, but you get the idea } }; $(clock).data('stopwatch', api); 

然后使用：

 $('#clock1').data('stopwatch').stop(); 

您还可以使用相同的逻辑将reset和startfunction添加到API。 这里的一件好事是，您可以在以后的咖啡rest时间内改进执行代码，而无需更改外部程序使用API​​的方式。

Answer 2

怎么样：

 $('#clock1').find('.stop').trigger('click');