jquery - 使用 jQuery 启动-停止-重置简单计时器

我有一个看起来像这样的代码

JS

var counter = 0;
var timer = setInterval("tictac()", 1000);

function tictac(){
    counter++;
    $("#clock").html(counter);
}

HTML

<div id="clock">0</div>
<div id="buttons" class="clear">
    <button id="start">start</button>
    <button id="stop">stop</button>
    <button id="reset">reset</button>
</div>

如何使用按钮来控制计时器，按下 start 按钮时开始计数，按下 停止 按钮时停止计数，按下 复位 按钮时重置计数器。

有人可以帮忙吗？

我设法做到了

        $(document).ready(function($) {

            var timer = undefined;
            $('#start').on('click', function(){
                timer = window.setInterval('tictac()', 1000);
            });
            $('#pause').on('click', function(){
                window.clearInterval(timer);
            });
            $('#reset').on('click', function(){
                timer = window.clearInterval(timer);
            });

        });

        var counter = 0;
        function tictac(){
            counter++;
            $("#clock").html(counter);
        }

开始和停止按钮可以工作，但重置不起作用，有人可以检查代码有什么问题吗？漂亮请

最佳答案

试试 http://jsfiddle.net/vishalgupta358/DkTWN/

var counter = 0;
var timer = null;

function tictac(){
    counter++;
    $("#clock").html(counter);
}

function reset()
{
clearInterval(timer);
    counter=0;
}
function startInterval()
{
timer= setInterval("tictac()", 1000);
}
function stopInterval()
{
    clearInterval(timer);
}

关于jquery - 使用 jQuery 启动-停止-重置简单计时器，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/19400995/