如何在最后一个孩子后添加元素？

Question

HTML：

<div class="uploader" id="uniform-file"> 
    <input type="file" name="data[Tolet][images][]" class="span12 tolet_img" id="file" style="width: 100%; opacity: 0;" size="20"><span class="filename">No file selected</span><span class="action">Choose File</span> 
</div> 

<div class="uploader" id="uniform-file"> 
    <input type="file" name="data[Tolet][images][]" class="span12 tolet_img" id="file" style="width: 100%; opacity: 0;" size="20"><span class="filename">No file selected</span><span class="action">Choose File</span> 
</div> 

JQuery的：

$(document).ready(function(){ 
    $('.tolet_img').click(function(){  
     var htmlString = $('.uploader').clone(true); 
     $('.uploader').children().last().after(htmlString); 
    });  
}); 

我预计会在点击下面的输出。

<div class="uploader" id="uniform-file"> 
    <input type="file" name="data[Tolet][images][]" class="span12 tolet_img" id="file" style="width: 100%; opacity: 0;" size="20"><span class="filename">No file selected</span><span class="action">Choose File</span> 
</div> 

<div class="uploader" id="uniform-file"> 
    <input type="file" name="data[Tolet][images][]" class="span12 tolet_img" id="file" style="width: 100%; opacity: 0;" size="20"><span class="filename">No file selected</span><span class="action">Choose File</span> 
</div> 

    <div class="uploader" id="uniform-file"> 
     <input type="file" name="data[Tolet][images][]" class="span12 tolet_img" id="file" style="width: 100%; opacity: 0;" size="20"><span class="filename">No file selected</span><span class="action">Choose File</span> 
    </div> 

但它不起作用。我究竟做错了什么？

Answer 1

试试这个：你可以用:last获得最后的上传和使用.after把你的新上传

$(document).ready(function(){ 
    $('.tolet_img').click(function(){ 
    var htmlString = $('.uploader:last').clone(true); 
    $('.uploader:last').after(htmlString); 
    }); 
}); 

注意 - 你把相同的ID为每个克隆上传这是不好的做法。相反，你可以用一些计数器或变量来改变id，如下所示。

$(document).ready(function(){ 
     var uploaderCount = 0; 
     $('.tolet_img').click(function(){ 
     var $htmlString = $('.uploader:last').clone(true); 
     $htmlString.attr('id', 'uniform-file-'+uploaderCount); 
     uploaderCount++; 
     $('.uploader:last').after($htmlString); 
     }); 
});