查找输入值并使用Jquery进行延迟计数

Question

我试图从输入字段中获取数值，然后输出从0到X（输入值）的值。我还需要使用Jquery将每次写入延迟20ms乘以当前输入值（因此对于值4，它将是4 * 20ms）。

我需要补充什么，以便发生这种情况？ // EDITED

$(".button").click(function() { 
    var honeypotValue = $("#numberBox").val(); 
    if ($("#numberBox").val() != ''){ 
    $(".honeypot").html(honeypotValue + " Bees"); 
    var loops = 0; 
    var loop = function(){ 
    while(loops < honeypotValue){ 
    loops++; 
    console.log(loops); 
    } 
    }; 
    loop(); 
} 
else { 
alert("Honeypot Empty") 
} 
}); 

Answer 1

我会用的setInterval功能可自动打印出蜜蜂的数量。我用i--运算符来减少蜜蜂的数量。

<button class="button">test</button> 
<input value="12" id="numberBox" /> 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> 
<script> 
    $(".button").click(function() { 
     var honeypotValue = $("#numberBox").val(); 
     if ($("#numberBox").val() != '') { 
      var max = Number(honeypotValue), i = 0; 
      tempFunction = function() { 
       console.log(i); 
       if (i < max) { 
        setTimeout(tempFunction,20*i); 
       } 
       i++; 
      } 
      setTimeout(tempFunction,20*i);   
     } 
     else { 
      alert("Honeypot Empty") 
     } 
    }); 

</script>