刪除動態創建的文本框

我有下面的代碼，我用它來點擊按鈕動態地添加文本框。有用。刪除動態創建的文本框

<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 
    }); 
}

我使用自動完成的文本框，從數據庫中獲得的數據

我要的是 - 假設如果用戶點擊添加更多贏家按鈕，但不想在文本框中添加任何數據，我應該給他一個按鈕來刪除額外的文本框。應該如何爲此編寫JavaScript？

確實看到我上面的代碼

來源

2013-10-03 user2822187

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(); 

}

簡單地用一個計數器來設置一個ID輸入按鈕和發送反刪除功能;

來源

2013-10-03 05:22:11 mamal

試試這個功能。

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

來源

2013-10-03 05:29:01

只需使用下面的代碼：

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

來源

2013-10-03 05:47:31 PathSeeker

嘗試添加刪除按鈕，同時動態地添加一個文本框中刪除文本框，如果有必要

下面是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();">'); 
    });

這是demo

來源

2013-10-03 06:03:35 iJade

刪除動態創建的文本框

回答

相關問題