JQuery удалить <form>из <div>

Question

Я спросил об этом самом примере в другом вопросе:
Заполните форму с помощью jQuery
, но я предпочел создать новую, чтобы спросить некоторые другие детали.
У меня есть div (панель), которая в настоящее время содержит только одну форму.
Эта форма должна представлять список координат.Он имеет несколько кнопок «+» - «для добавления или удаления пары координат (и, следовательно, формы).Каждая форма автоматически генерируется функцией и имеет собственный идентификатор.

<div id="panel" style="position: absolute; left: 190px; top: 300px; width: 400px; height: 300px; border: medium groove brown; background: none repeat scroll 0% 0% black; z-index: 100; color: white;">  
<form id="form_coord_0">  
X <input type="text" style="height: 25px; font-size: 10px;" size="2" name="X" id="coordX_0"/>  
Y <input type="text" style="height: 25px; font-size: 10px;" size="2" name="Y" id="coordY_0"/>  
<input type="button" id="edit_0" value="M"/>  
<input type="button" id="remove_0" value="-"/>  
<input type="button" id="add_0" value="+"/>  
<input type="button" id="go_0" value="go!"/>  
<br/>  
</div>  

Я ищу способ:
- удалить строку и связанную форму
- удалить все строки итогда все формы

У меня есть эта функция:

function add_form(id_coord){  
    var new_form="<form id= '"+ id + "'> </form>";
    $("#panel").append(new_form);
}

, которая добавляет одну форму.
И циклы for, которые добавляют разные строки.
После того, как строка должнаудаленный Я бы предпочел отредактировать базовую структуру данных и очистить div.Затем он может быть снова заполнен другим циклом for.Вопрос заключается в следующем: как удалить одну форму или каждую форму div?Я думал о том, чтобы установить div.innerHTML на "", но мне действительно не нравится это решение.

Answer 1

удалить строку и связанную форму

Это удалит конкретную форму. Вы можете изменить селектор, если это не то, что вы имели в виду. Вы можете выбрать любой элемент (ы) и удалить их с помощью .remove () .

$("#specific-form-id").remove();

удалить все строки, а затем все формы

Вы можете удалить все дочерние элементы с помощью .empty () .

$("#panel").empty();

Answer 2

Полагаю, вы хотите, чтобы ваши "кнопки удаления" выполняли удаление?

$('.remover').click(function(){
    $(this).closest('form').remove();
}); 

сработало бы, если бы вы добавили класс "remover" к кнопкам для упрощения нацеливания

<input type="button" id="remove_0" value="-"/> 

Удаление всех форм - это просто выбор и удаление в любом подходящем обработчике событий.

$('form').remove();

Answer 3

Первый пример

$("#panel").remove(line_id)

Второй пример

$("#panel").html('')