Question

我想做的是让问题2函数在问题函数的settimeout到期时运行。我仅将settimeout函数放在第一个“ if”语句上进行尝试和测试，但最终我会将它们放到所有对象上。任何帮助将不胜感激。

第一步是单击开始按钮，计时器启动，并且通过功能问题出现问题1。我拉出各种答案选项，并将其放入if函数中。如果命中了正确的答案，则正确地添加1，并显示所有内容，并附带问题1的图像。问题出在我想在第一个问题完成后运行question2函数。任何帮助，将不胜感激。我一直并且正在继续进行调查，并希望能得到回报。

$(".Start_Button").click(function() {

    function countdown() {
        timer = 20;
        timerId = setInterval(function() {
        timer--;
        console.log(timer);
        $(".timer").html("Timer: " +timer);
        if(timer == 0) {
            console.log("Time is up");
            alert("Time is up!");
            incorrect ++;
            $("#img1").show();
            $(".list-group").hide();
            $(".Game").hide();
            $(".timer").hide();
            $(".timer").reset();
            }        
        }, 1000);
    }
    countdown();


    $(".Start_Button").hide();
    function questions () {
        $(".list-group").show();
        $(".Game").html(questions[0]);
        $(".list-group-item1").html(answers1[0]);
        $(".list-group-item2").html(answers1[1]);
        $(".list-group-item3").html(answers1[2]);
        $(".list-group-item4").html(answers1[3]);

    if($(".list-group-item4").click(function(){
        setTimeout(function (){
        alert("you got it right!");
        correct ++;
        $("#img1").show();
        $(".list-group").hide();
        $(".Game").hide();
        $(".timer").hide();
        $(".timer").reset();
        question2();
    })
    })); 

  if($(".list-group-item1").click(function(){
       alert("you got it wrong!");
       incorrect ++;
       $("#img1").show();
       $(".list-group").hide();
       $(".Game").hide();
       $(".timer").hide();
       $(".timer").reset();
   }));

   if($(".list-group-item3").click(function(){
        alert("you got it wrong!");
        incorrect ++;
        $("#img1").show();
        $(".list-group").hide();
        $(".Game").hide();
        $(".timer").hide();
        $(".timer").reset();
   }));

  if($(".list-group-item4").click(function(){
        alert("you got it wrong!");
        incorrect ++;
        $("#img1").show();
        $(".list-group").hide();
        $(".Game").hide();
        $(".timer").hide();
        $(".timer").reset();
  }));

}
questions();



function question2() {
$(".list-group").show();
$(".Game").html(questions[1]);
$(".list-group-item1").html(answers2[0]);
$(".list-group-item2").html(answers2[1]);
$(".list-group-item3").html(answers2[2]);
$(".list-group-item4").html(answers2[3]);

if($(".list-group-item2").click(function(){
    alert("you got it right!");
    correct ++;
    $("#img1").show();
    $(".list-group").hide();
    $(".Game").hide();
    $(".timer").hide();
    $(".timer").reset();
})); 

   if($(".list-group-item1").click(function(){
   alert("you got it wrong!");
   incorrect ++;
   $("#img1").show();
   $(".list-group").hide();
   $(".Game").hide();
   $(".timer").hide();
   $(".timer").reset();
  }));

  if($(".list-group-item3").click(function(){
  alert("you got it wrong!");
  incorrect ++;
  $("#img1").show();
  $(".list-group").hide();
  $(".Game").hide();
  $(".timer").hide();
  $(".timer").reset();
  }));

 if($(".list-group-item4").click(function(){
 alert("you got it wrong!");
 incorrect ++;
 $("#img1").show();
 $(".list-group").hide();
 $(".Game").hide();
 $(".timer").hide();
 $(".timer").reset();
 }));    
 }

 question2();

});    
});

 <body>

  <div class = "container">
  <div class = "row">
  <div class = "col-md-12">
    <div class = "timer">
    </div>
    </div>
       </div>


    <div class = "row">
    <div class = "col-md-12">
    <div class = "Game">
    </div>
    </div>
    </div>

   <div class = "row">
  <div class = "col-md-12">
  <div class = "answers">
  <ul class="list-group">
  <button class="list-group-item1"></button>
  <button class="list-group-item2"></button>
  <button class="list-group-item3"></button>
  <button class="list-group-item4"></button>
   </ul>
    </div>
   </div>
   </div>

   <div class = "row">
   </div>

   <div class = "row"></div>
   <div class = "Start_Button">
   <button type="button" class="btn btn-secondary btn-lg">Start</button>
    </div>

   <div class = "Photos">
   <div class = "row">
    <img id = "img1" src = "assets/images/map-of-asia.gif">
    <img id = "img2" src = "assets/images/Flag_of_Canada.svg.png">
    <img id = "img3" src = "assets/images/Antartica.jpg">
    <img id = "img4" src = "assets/images/Peru.jpg">
    <img id = "img5" src = "assets/images/sudan-location-map.jpg">
    <img id = "img6" src = "assets/images/Alaska.jpg">
    <img id = "img7" src = "assets/images/Saudi_Arabia.png">
    <img id = "img8" src = "assets/images/Brazil.jpg">
      </div>
      </div>

      </div>
      </body>

Answer 1

我认为您的问题可能出在您在questions（）函数中为question2调用函数的地方。

尝试从setTimeOut（）回调中取出toydat %>% rowwise() %>% mutate(thing4 = toyfun(thing1 = thing1)) #Called from: toyfun(thing1 = thing1) #Browse[1]> thing1 #[1] 4 toydat %>% rowwise() %>% mutate(thing4 = toyfun(thing1 = thing1)) # thing1 thing4 # <dbl> <dbl> #1 4 5 #2 3 4 #3 2 3 #4 1 2 #5 1 2 #6 2 3函数以获取完整答案，并在为questions（）函数编写事件处理程序之后，编写一个三元运算符，以检查是否有计数器question2()增加了1。如果增加了（即correct），则呈现问题2（）

Answer 2

以更简单的方式可以做到：

function test1() {
    setTimeout(function () {
        test2();
    }, 3000)
}
test1();
function test2() {
    console.log(5)
}

在SetTimeout之后如何运行另一个功能？

2 个答案: