0

以下のコードは、開始ボタンがクリックされたときに 1 から 10 までの番号を順番に追加します。clearTimeoutストップボタンクリックで操作をキャンセルしたい。

動的変数を作成する必要があるように思えますが (x には現在doSetTimeout関数が割り当てられています)、その方法をまだ見つけていません。助言がありますか?

ありがとう!

<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

<script>
function doSetTimeout(func, func_param, time) {
    setTimeout(function(){func(func_param);}, time);
}

function createNode(base) {
    var node = document.createElement("p");
    var writeI = base + "";
    var textnode = document.createTextNode(writeI);
    node.appendChild(textnode);
    document.body.appendChild(node);
}   

$(document).ready(function() {
        $("#start").click(function() {
            for (var i = 1; i <= 10; i++) {
                var time = i*1000;
                var x = doSetTimeout(createNode, i, time);
            }           
        });
});         
</script>
</head>
<body>
    <button id="start">Start</button>
    <button id="stop">Stop</button>
</body>
4

1 に答える 1

2

の戻り値を取得してリストに保持し、 stopsetTimeoutをクリックするとクリアします。

function doSetTimeout(func, func_param, time) {
    return setTimeout(function(){func(func_param);}, time);
}

$(document).ready(function() {
    var timeouts = [];
    $("#start").click(function() {
        for (var i = 1; i <= 10; i++) {
            var time = i*1000;
            timeouts.push(doSetTimeout(createNode, i, time));
        }     
    });
    $("#stop").click(function () {
        for (var i = 0; i <= timeouts.length; i += 1) {
            clearTimeout(timeouts[i]);
        }
    });
});

これにより、すでに終了したタイムアウトもクリアされる可能性がありますが、それが本当に非常に重要であるとは思えません。

于 2013-10-02T15:46:53.963 に答える