如何刪除這是通過JavaScript

插入輸入字段

有人請幫助我如何添加新功能來刪除該字段，我有JS腳本功能添加新的字段，如下如何刪除這是通過JavaScript

<script language="javascript"> 
fields = 0; 
function addInput() { 
    if (fields != 10) { 
     var htmlText = "&nbsp;&nbsp;<input type='text' name='friends[]' value='' size='auto' maxlength='45' /><br />"; 
     var newElement = document.createElement('div'); 
     newElement.id = 'new_field'; 
     newElement.innerHTML = htmlText; 

     var fieldsArea = document.getElementById('new_field'); 
     fieldsArea.appendChild(newElement); 
     fields += 1; 

    } else { 
     alert("Only 10 fields allowed."); 
     document.form.add.disabled=true; 
    } 
} 
</script>

但我需要一些幫助添加刪除字段的新功能，對於任何建議和指針，我將不勝感激。

來源

2010-11-21 jones

如果你添加一些IDS的「格」這將是easyer讓他們去除。 – Bakudan 2010-11-21 19:09:51

您不能擁有'newElement.id ='new_field';'因爲頁面上的每個ID必須是唯一的。添加對您的ID唯一的內容。我建議像這樣：在函數外部聲明變量count = 0;每次添加一個新的輸入計數++; 'newElement.id ='new_field'+ count' – cristian 2010-11-21 19:24:17

不錯的建議Octopus-Paul，以及我替換：newElement.id ='new_field';與：newElement.id ='new_field'+（fields + 1）;,這也適用於除IE以外的大多數瀏覽器，但我不知道我是正確的，需要更多的指針，非常感謝 – jones 2010-11-22 04:42:12

這裏閱讀removeChild之（）函數removeChild() - mozilla developer

編輯或瀏覽：removeChild() w3schools

來源

2010-11-21 19:01:05 cristian

首先，有一個已有的問題，我用你的代碼中看到。您正在將每個新字段的ID設置爲相同的值，這是無效的HTML並且要求麻煩。一定要解決這個問題。

DOM元素的.removeChild method是你想要的。 .removeChild只有當傳入的節點實際上是該元素的子節點時纔會從DOM樹（文檔中實際包含的元素集合）中刪除節點（元素或文本），否則會發生錯誤。

您可以輕鬆地通過查找其容器last child刪除最後一個字段：

function removeLastField() { 
    var fieldsArea = document.getElementById('new_field'), 
     lastChild = fieldsArea.lastChild; 
    if(lastChild) { 
     fieldsArea.removeChild(lastChild); 
     fields -= 1; 
    } 
}

來源

2010-11-21 19:23:21 PleaseStand

嗨idealmachine，我做了你的解釋，但似乎並沒有工作，即將id設置爲唯一的ID，我試試替換：ewElement.id ='new_field';與：newElement.id ='new_field'+ 1;那是正確的？請不要猶豫，給予更多的建議，並提前致謝 – jones 2010-11-22 04:54:22

把'newElement.id ='new_field'+ 1'是不正確的，因爲所有的id都是new_field1。你的ID應該是像new_field1，new_field2 .... – cristian 2010-11-22 09:14:43

如何刪除這是通過JavaScript

回答

相關問題