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

我有一个静态div上的链接，默认情况下已经加载（Div number 1）。如何增加数量并显示动态添加的div jquery？

如图所示，每当我点击超级链接时，div都会添加到每一个我最擅长的div的下面。我想要做的是，正如你在图片中看到的那样，我必须在动态添加的div上增加div数字（如2,3,4）以及称为'Div number ...'的文本。

enter image description here

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

来源

2014-10-07 Vasethvan

显示你的努力呢？ – Amit 2014-10-07 12:40:11

到目前为止，你有尝试过什么吗？ – 2014-10-07 12:40:28

您可以发布您迄今为止写的代码来实现屏幕截图中的内容吗？ – 2014-10-07 12:40:45

这是非常简单的。只需追加新的div。

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

作为演示：Click here

来源

2014-10-07 12:59:46

@Vasethvan有什么区别？这个方法和我的完全一样，你接受后仍然不接受我的回答。理由？ – 2015-07-01 07:12:22

假设您将div放入容器ID“容器”中。

添加递增div的代码是。

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

来源

2014-10-07 12:41:41 developerCK

嗨，伙计，我试过你的代码，但我没有得到任何正确的结果。也许我错过了一些东西... var noofDivs = $（'。assignContName'）。length; alert（noofDivs）; var incno = parseInt（noofDivs，10）+ 1; 我收到预期的增量订单警报。我如何插入特定的div内的值？为了您的实物信息，我已在'.assignContName'中插入值的范围内的标记。 – Vasethvan 2014-10-07 12:58:06

我尝试了一些基于你的逻辑的方法，工作正常。但为了简单起见，我跟着其他东西。我会复制你的代码，当我需要时会使用它。谢谢你的解决方案。 – Vasethvan 2014-10-07 13:13:07

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

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

来源

2014-10-07 12:41:56

其伪代码，OP没有给出任何代码示例，所以 – 2014-10-07 15:57:01

是啊谢谢你指出，更新 – 2014-10-07 16:51:09

尝试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; 
    }

来源

2014-10-07 13:01:52

谢谢老兄。它工作非常完美。我只关注你的代码... – Vasethvan 2014-10-07 13:13:40

Pleasure @ user3667940 :) – 2014-10-07 13:14:14

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

回答

相关问题