1

ボタンをクリックしてから時刻を開始し、10から0までカウントした後にdivを表示したい。

私のprobelmは、カウントを開始する方法がわかりませんか？

javascript：

<script>
$("button").click(function() {
$('div#test').hide().delay(200).fadeIn('slow');
});
</script>

ボタン ：

 <div id="test" style="display:none;">click</div>

html：

<div id="test" style="display:none;">here you are !</div>
4

3 に答える 3

1

setIntervalカウントに使えます。

var count = 10;
var temp = setInterval(function(){
  if(count < 0) {
      clearInterval(temp);
   }
  // show count 
  count--;


}, 1000);
于 2012-10-24T13:15:47.383 に答える
0 
var count = 15;
var timerID = 0;
$("button").click(function() {
    $('div#test').hide().delay(200).fadeIn('slow', function() {
         timerID = setInterval(function() {countDown();}, 1000);  // count every 1000 ms, change this to whatever you want
    });
    $("#wait").show();  // or you could fade this in if you want. Maybe that's what you intended with #test.
});

function countDown() {
    count--;
    $("#count").text(count);
    // do whatever you want to do with your count
    if (count <= 0) {
         clearInterval(timerID);
    }
}

HTML:

<p id="wait" style="display:none">Please wait<span id="count">15</span> seconds...</p>

フェードインの後にカウントダウンを開始したいとします。それ以外の場合は、その部分を引き出して、ボタンが最初にクリックされたときにカウントダウンを開始する、fadeIn 行の後に setInterval を設定します。

于 2012-10-24T13:17:57.903 に答える
0

setTimeout() または setInterval() を使用して動作させることができます。

以下は私がそれをした方法です：

    $(function() {
$("button").click(function() {
    function counter()  {  
        var i = 10;
        $("body").append('<div style="border:1px solid red;">Div Created on the Fly</div>')
        function showDIV() {

        if (i < 0)
            return 
        setTimeout(showDIV, 1000);
        $("span").text(i);
        i--;        

    }

    showDIV();
}
counter(10);
});

});

デモ

于 2012-10-25T01:32:36.387 に答える