Question

此代码非常适合显示一个通知div，但我希望一个接一个地显示此通知div。

<button onclick="myFunction()">Show Notification</button>

<div id="container">This is First Notification</div>

<script>
function myFunction() {
var x = document.getElementById("container")
x.className = "show";
setTimeout(function(){ x.className = x.className.replace("show", ""); },      3000);
}
</script>

Answer 1

您可以使用递归

    function showTimes(count, times) {
  $('#container').show();
  $('.info').append("show number" + (count + 1) + "<br>");
  console.log('func');
  setTimeout(function() {
    $('#container').hide()
    console.log('count: ' + count + '; times: ' + times);
    if (count >= times) {
      return;
    } else {
      setTimeout(showTimes(count + 1, times), 2000);
    }
  }, 3000);
}
$(document).ready(function() {
    showTimes(0, 10);
});

jsfiddle（按顶部的RUN） https://jsfiddle.net/ShinShil/v8ftcnLz/2/

如何使用javascript或jquery在循环中显示div

1 个答案: