удалить динамически созданное текстовое поле

Question

удалить динамически созданное текстовое поле

0

У меня есть следующий код, который я использую для динамического добавления текстовых полей при нажатии кнопки. Оно работает.

<div id="forms" name="forms">
  <input name="winner[]" type="text" id="tag" size="20"/><br/>
</div>
<input type="button" name="addmore" id="addmore" value="Add More Winners" onclick="addForm()"/>

Javascript для вышеуказанного кода:

function addForm() {
    $("#forms").append(
            "<input type ='text' class='winner' name='winner[]'><br/>");

    $(".winner").autocomplete("autocomplete.php", {
    selectFirst: true
    });
}

Я использую auto complete для получения данных из базы данных в текстовом поле

Я хочу - предположим, что если пользователь нажимает кнопку добавления большего количества победителей, но не хочет добавлять какие-либо данные в текстовое поле, я должен дать ему кнопку для удаления дополнительного текстового поля. Как JavaScript должен быть написан для этого?

Посмотрите мой выше код

user2822187 03 окт. 2013, в 07:56

Источник

Теги:

php

javascript

jquery

html

4 ответа

Ещё вопросы

mamal · Answer 1 · 2013-10-03T03-38-00.000Z

var i=0;    
function addForm() {
    i++;
   $("#forms").append(
"<input type ='text' id='input_'"+i+" class='winner' name='winner[]'><button    onclick='delete('"+i+"')' id='button_'"+i+">delete</button><br/>");

$(".winner").autocomplete("autocomplete.php", {
selectFirst: true
});

function delete(i)
{
    $("#input_"+i).remove();
    $("#button_"+i).remove();

}

просто используйте счетчик для установки идентификатора на входы и кнопки и отправьте этот счетчик для удаления функции;

iJade · Answer 2 · 2013-10-03T04-40-00.000Z

Попробуйте добавить кнопку удаления при добавлении текстового поля динамически, чтобы удалить текстовое поле, если необходимо

Вот код html

    <div id="forms" name="forms">
      <input name="winner[]" type="text" id="tag" size="20"/><br/>
    </div>
    <input type="button" name="addmore" id="addmore" value="Add More Winners" />

Вот код jQuery

    $('#addmore').click(function () {
        $('#forms').append('<input type ="text" class="winner" name="winner[]"><input type="button" onclick="$(this).prev().remove();$(this).remove();">');
    });

Вот демонстрация

Iren Patel · Answer 3 · 2013-10-03T04-25-00.000Z

Попробуйте эту функцию.

function removeElement()
{
if(intTextBox != 0)
{
var contentID = document.getElementById('content');
contentID.removeChild(document.getElementById('strText'+intTextBox));
intTextBox = intTextBox-1;
}
}

PathSeeker · Answer 4 · 2013-10-03T04-02-00.000Z

Просто используйте приведенный ниже код:

   $("#forms").append("<p><input type ='text' class='winner' name='winner[]' ><button onclick='$(this).parent().remove()'>delete</button></p>");