在Jquery中运行一定次数的函数

Question

我有一些JQuery在页面上随机放置div。但是，目前，它是无限的。

我怎样才能让它运行一段时间然后停止？

＆＃13;

＆＃13;

$(document).ready(function () {
  makeDiv();

var  count = 1;
  function makeDiv() {
    
    count ++;
    while (count < 50){
      var numRand = Math.floor(Math.random() * 501);
      var divsize = 100;
      var posx = (Math.random() * ($('body').width() - divsize)).toFixed();
      var posy = (Math.random() * ($('body').height() - divsize)).toFixed();
      $newdiv = $("<div class='exploding'></div>").css({
        'left': posx + 'px',
        'top': posy + 'px'
      });
      $newdiv.appendTo('body').delay(2000).fadeIn(100, function () {
        //$(this).remove();
        makeDiv();
      });
    }
  }
});

＆＃13;

body, html {
    width: 960;
    height: 100%;
}
div.box {
    position: relative;
    width: 100px;
    height: 100px;
}
div.exploding {
    position: absolute;
    width: 10px;
    height: 10px;
    background-color: red;
}

＆＃13;

＆＃13;

＆＃13;

Answer 1

count++;必须在while循环中

Answer 2

在count内声明makeDiv而不是全局。并在while循环的末尾添加count++。在while.they中不要使用相同的makeDiv()，而循环是重载

$(document).ready(function () {
  makeDiv();


  function makeDiv() {
    var  count = 1;
  
    while (count < 50){
      var numRand = Math.floor(Math.random() * 501);
      var divsize = 100;
      var posx = (Math.random() * ($('body').width() - divsize)).toFixed();
      var posy = (Math.random() * ($('body').height() - divsize)).toFixed();
      $newdiv = $("<div class='exploding'></div>").css({
        'left': posx + 'px',
        'top': posy + 'px'
      });
      $newdiv.appendTo('body').delay(2000).fadeIn(100, function () {
        $(this).remove();
      //  makeDiv();
      });
        count ++;
    }
  }
});

body, html {
    width: 960;
    height: 100%;
}
div.box {
    position: relative;
    width: 100px;
    height: 100px;
}
div.exploding {
    position: absolute;
    width: 10px;
    height: 10px;
    background-color: red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>