如何在动态添加的div jquery上增加数量并显示？

Question

我在静态div的顶部有一个链接，默认情况下已加载（Div编号1）。

如图所示，每当我点击超链接时，div都会添加到我做得非常好的每个最后一个div下面。我想要做的是，正如你在图片中看到的那样，我必须增加div数量，如2,3,4，以及称为＆＃39; Div number ...＆＃39;动态添加div。

如何使用jQuery实现这一目标？

Answer 1

也许我的伪代码会给你一个想法

$('#linktoadd').click(function(){
    $('#divholder').append('<div class="foo">Div Number'+($('#divholder div').length +1) +'</div>');
 }

Answer 2

这很简单。只需添加新的div。

(function(){
  var div = 0;
  $(".create").click(function(){
    div++;
    $(".block").append('<div class="new_div">Div number '+div+'</div>');
  });
})();

作为演示：Click here

Answer 3

尝试 DEMO

HTML 的

 <div>
     <a id="lnk" href="#">Link to add more divs</a>
 </div> 

SCRIPT

 var count = 1;
 $("#lnk").click(function () {
    $(this).parent().append('<div class="divStyle">Div number ' + count + ' </div>');
    count++;
 });

CSS

 .divStyle {
     background-color:gray;
     margin-bottom:2px;
  }

Answer 4

假设您将div放入容器ID＆＃34; container＆＃34;。

添加递增div no的代码是。

 var no = $('div','#contianer').length; // will give you total no of div in that container.
var incno = parseInt(no,10)+1;