JavaScript循环仅在使用.empty函数时返回最后一个值

我只想将数据仅附加到特定的ID myID中。它仅打印循环的最后值，即 3。

 setInterval(sample, 2000);
 function sample()
 {
   for(var i=0;i<=3;i++)
     {
         $('.found .find').each(function() {
             if(this.id == "myID")
              {
                // if the ID of this element is equal to #myID
                // this is the place where the data will append
                $(this).empty();
                $(this).append(i);
              }
         });
     }
 }

html：

<div class="found">
      <div class="find" id="myID"></div>
</div>
 <div class="found">
      <div class="find" id="anID"></div>
</div>
<div class="found">
      <div class="find" id="anID2"></div>
</div>

empty从给定元素中删除所有孩子，因此您可能要在循环之前使用它：

$('.found').empty();
for (var i=0; i <= 3; i++) {
  $('.found').append(i);
}

这将清空容器，然后附加您的元素列表（或数字）。

这可以在MVC Framework的render方法中使用，以在添加新内容之前清空上一个渲染的容器。

尝试

$(function() {    
        setInterval(loop, 1000);
        function loop() {
          var n = "0123";
          for(var i=0;i<=3;i++) {
            $(".found").find(".find[id*=ID]").html(n);
          }    
        }
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">
</script>
<div class="found">
      <div class="find" id="myID"></div>
</div>
 <div class="found">
      <div class="find" id="anID"></div>
</div>
<div class="found">
      <div class="find" id="anID2"></div>
</div>

只需进行一次即可修改代码一次如果要继续执行原始代码

，请运行原始代码

    <html>
    <head>
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
      <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
      <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
      <style>
      </style>
    </head>
    <body>
    <div class="found">
      Hello World
    </div>
    <div class="found">
          <div class="find" id="myID"></div>
    </div>
     <div class="found">
          <div class="find" id="anID">Append here</div>
    </div>
    <div class="found">
          <div class="find" id="anID2"></div>
    </div>
    <script>
    $(document).ready(function(){

    //$('#anID').empty();
for(var i=0;i<=3;i++)
{
    $('<p>'+i+'</p>').appendTo('#anID');
    //$('.found').append(i);
    //$('.found').append("n"); 
}

});
    </script>
    </body>
    </html>

  $(function() {    
    setInterval(loop, 1000);
    function loop() {
        $(".found").find(".find[id*=ID]").empty();
      for(var i=0;i<=3;i++)
      {
        $(".found").find(".find[id*=ID]").prepend(i);
      }    
    }
});

相关内容

最新更新

热门标签：