jQuery - Дублирование фрагмента HTML при нажатии кнопки

#jquery

Вопрос:

Мне было интересно, возможно ли скопировать блок HTML непосредственно под другим.

У меня есть таблица с кнопкой «Добавить строку» под ней, когда пользователь нажимает кнопку «Добавить строку», мне это нужно для репликации следующего HTML

 <tr style="height: 31px;">
<td style="background-color: #e4e4e4;">
    <select name="timetocall" id="timetocall" style="width: 159px; margin-left: 8px;">
        <option value="residential" selected>Residential</option>
    </select>       
</td>
<td style="background-color: #e4e4e4;">$ <input type="text" value="120,000.00" name="emailaddress" id="emailaddress" style="width: 151px;" maxlength="256"></td>
<td style="background-color: #e4e4e4;">$ <input type="text" value="420,000.00" name="emailaddress" id="emailaddress" style="width: 151px;" maxlength="256"></td>
</tr>

Возможно ли это вообще?

Ответ №1:

Укажите <tr> идентификатор, например id="template" , затем:

 $('#template').clone().removeAttr('id').appendTo('table > tbody');

Вы также можете заменить любые идентификаторы, которые будут клонированы, такие как id="timetocall" и заменить их классами, поскольку все идентификаторы должны быть уникальными.

Вот демонстрационный пример:http://jsfiddle.net/EGp6Q /.