如何在满足条件后重置时间

时间:2016-02-03 14:19:16

标签: javascript jquery html html5 jquery-ui

我已经有了一个开始按钮,但我需要的是在满足条件时重启按钮并再次点击按钮。

HTML CODE:

 <div id="content" class="row-fluid">
  <div class="span6 pull-right align-right white" style="max-width: 540px;">
    <div style="display: block;">

4 个答案:

答案 0 :(得分:0)

添加“clicked”var来检查是否需要重新启动时间

//---------------------------toggle-----------------------
$( ".picture" ).click(function() {
  $( "#container" ).toggle( "fold", 500 );

});
$( ".numbers1" ).click(function() {
  $( "#numbers" ).toggle();

});
//==========================================================

var done = true;
var clicked = true;
function check(counter){

         if (counter >= 0) {
           $("#count").text(counter);
         }
         if (counter === 0 && winner === 0) {
           $("<div title='Oh no!'><center><img src='https://www.foreignlanguagesforkids.com/playa/images/shark.png'></center><p style='text-align: center;'>Let's get Calamity Carl to the hospital, pronto! Lucky for Carl, the doctors are experts at fixing him up and he will be as good as new in no time, only to get himself in trouble all over again!</p><div style='margin-top: 15px; width: 100%;'><div style='float: left; width: 48%; text-align; center;'><a class='btn button' href='https://www.foreignlanguagesforkids.com/playa'>Play Again</a></div><div style='float: right; width: 48%; text-align: center;'><a class='btn button' href='https://www.foreignlanguagesforkids.com/playa'>End Game</a></div><div style='clear: both;'></div></div></div>").dialog();
           clearInterval(timer);
            $('#fail')[0].play();
            clicked = true;
         }

}
$("#startClock").click(function() {
var counter = 60;
 var winner = 0;
var winners=0;



//===============================================CAR DRAGGABLE===================

    $("#car").draggable({
    revert: "invalid", containment: "#wrapper",
    start: function(event, ui){
        if(!done) return false;
    },
    stop: function(event, ui){
        if($(".correct").length == $(".drop").length){
            setTimeout(function(){
                 $('#win').text(winner+' '+'stars'+' '+'earned');
            },500);
            winner = 1;
            clearInterval(timer);
            clicked = true;
        }
    }
    });

     $("#two").draggable({
    revert: "invalid", containment: "#wrapper",
    start: function(event, ui){
        if(!done) return false;
    },
    stop: function(event, ui){
        if($(".correct").length == $(".drop2").length){
            setTimeout(function(){
                  $('#win1').text(winners+' '+'stars'+' '+'earned');
            },500);
            winners = 2;

            clearInterval(timer);
            clicked = true;

        }
    }
    });

//===============================================/CAR DRAGGABLE     End===================

//====================================================================Two               draggable==========================

   if(counter > 59 && clicked){
   clicked = false;
    timer = setInterval(function(){
    check(counter);
    counter--;
    },1000);

}


//=========================================/TWO DRAGGABLE END==========================

});

//===================================================CAR DROPPABLE================================

$("#carDrop").droppable({
    accept: "#car",
    drop: function(event, ui) {
        if(ui.draggable.is("#car")){
            $(this).addClass("correct").find("p").html("correct!");
            done = false;
            ui.draggable.fadeOut(500);
            $(this).fadeOut(500,function(){
                done = true;
            });
        }
    }
});

//==================================================two droppable===========================

$("#twoDrop").droppable({
    accept: "#two",
    drop2: function(event, ui) {
        if(ui.draggable.is("#two")){
            $(this).addClass("correct").find("p").html("correct!");
            done = false;
            ui.draggable.fadeOut(500);
            $(this).fadeOut(500,function(){
                done = true;
            });
        }
    }
});

答案 1 :(得分:0)

就像卢卡所说,目前还不清楚你在问什么,是否有可能详细说明你想做什么?

根据我的理解,你只想重置计时器,这将是变量。

如果是这样那么就是这样:

if(counter == 0) {
    counter = 60;
}

答案 2 :(得分:0)

以下是我注意到的事情。

  1. `的javascript:肘节();切换未在&#34; startClock&#34;中定义。定义或删除它
  2. 没有带id的元素&#34;失败&#34;。所以下面的行抛出错误

    $(&#39;#失败&#39;)[0] .play();

  3. 删除条件if (!timer)并定义变量&#34; timer&#34;在&#34; startClock&#34;点击事件。

  4. 应用上述更改并查看是否有帮助

答案 3 :(得分:0)

// setup timer, keep pointer to it in mytimer variable

var mytimer = setTimeout(function(){
   alert('hello 2s have passed!');
},2000);

// cancel timer

clearTimeout(mytimer); 

请注意,setInterval()clearInterval()