想要在單擊Href鏈接時添加標簽和文本框

Question

我正在使用MVC，我的代碼如下所示，

    <div class="form-inline">
    <label class="control-label"><b>Length</b></label>

    <input type="text" name="Refinishing.Room.Length.Feet" id="Refinishing_Room_Length_Feet" style="width: 80px" class="floor-text" />Ft
    <input type="text" name="Refinishing.Room.Length.Inch" id="Refinishing_Room_Length_Inch" class="floor-text" />Inch

    <label><b>Width</b></label>

    <input type="text" name="Refinishing.Room.Width.Feet" id="Refinishing_Room_Width_Feet" class="floor-text" />Ft
    <input type="text" name="Refinishing.Room.Width.Inch" id="Refinishing_Room_Width_Inch" class="floor-text" />Inch<br />

    <a href="#">Add Room</a> / <a href="#">Remove Room</a>
</div>

我想單擊鏈接“添加房間”添加“ <div>”的內容。 如何做呢？

Answer 1

嘗試使用.clone()和.append()

 $('body').on('click','a.addroom', function(e) {
     e.preventDefault();

     var $cloned = $('.form-inline:eq(0)').clone();

     $('body').append($cloned);

 }); 


 $('body').on('click', 'a.removeroom' ,function(e) {
     e.preventDefault();
     $(this).closest('div').remove();
}); 
<a href="#" class="addroom">Add Room</a>

這里div的內容被克隆並附加到主體上。

工作場所