如何通过按钮删除对象？

问题描述：

我建了两个按钮，这个值（“+”和“ - ”）当我点击“+”它会创建一个文本和组合框，我想知道如何与删除“ - ”？按钮（由只有JavaScript）如何通过按钮删除对象？

下面的代码：

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<title>create and delete</title> 
<script type="text/javascript"> 
/*this function creates text box and combo box*/ 
function cre() 
    {var t=document.createElement('select'); 
    var form=document.getElementById('theForm'); 
    var label = document.createElement('label'); 
    var textbox = document.createElement('input'); 
    form.appendChild(t); 
    form.appendChild(textbox);} 
function del() 
    /*{delete t,form,label,textbox;}*/ 
</script> 
</head> 
<body> 
    <form id='theForm'> 
     <input type="button" value="+" onclick="cre()" /> 
     <input type="button" value="-" onclick="del()" /> 
    </form> 
</body> 
</html>

https://developer.mozilla.org/en-US/docs/DOM/Node.removeChild – 2013-05-08 05:40:20

看看[这里]（http://*.com/questions/ 3387427/JavaScript的删除元素，通过-ID） – quickshiftin 2013-05-08 05:41:22

你为什么不试试jQuery的？这是很容易 – Shin 2013-05-08 06:11:40

答

function del() 
     { 
     var form=document.getElementById('theForm'); 
     var t = form.getElementsByTagName('select'); 
     var textbox = form.getElementsByTagName('input'); 
     if(t != 'undefined' && textbox != 'undefined') 
     { 
      form.removeChild(t[t.length-1]); 
      form.removeChild(textbox[textbox.length-1]); 
     } 
     }

Fiddle供您参考

这只适用于最后一个对象。重复的点击无所作为。 – 2013-05-08 05:45:13

嗨，谢谢你的答案，它的工作，但它只能删除其中的一个，例如当我点击“+”3次，我想删除它们，它只删除其中的一个 – 2013-05-08 05:46:21

Yupp我刚才说他使用removeChild if他想删除他应该为这些对象创建ID其他对象，而且尝试，捕捉和其他条件.. – 2013-05-08 05:47:16

答

我的解决办法：

cre = function() { 
    var form = document.getElementById('theForm'), 
     div = document.createElement('div'), 
     t = document.createElement('select'), 
     label = document.createElement('label'), 
     textbox = document.createElement('input'); 

    div.className = 'divContainer'; 
    div.appendChild(t); 
    div.appendChild(label); 
    div.appendChild(textbox); 
    form.appendChild(div); 
} 

/*{delete t,form,label,textbox;}*/ 
delForm = function() { 
    var form = document.getElementById('theForm'); 
    form.parentNode.removeChild(form); 
} 

del = function() { 
    var containers = document.getElementsByClassName('divContainer'); 
    for(var i = 0; i < containers.length; i++) { 
     if(typeof(containers[i]) === 'object') { 
      containers[i].parentNode.removeChild(containers[i]); 
     } 
    } 
}

的jsfiddle：http://jsfiddle.net/j6Fxc/27/

设定值是：“/ * {删除T，表格，标签，文本框;} * /” – EpokK 2013-05-08 05:55:12

他不是制作表格每个“+”点击 – 2013-05-08 05:56:31

它不工作，你有没有尝试它发布之前呢？ – 2013-05-08 06:00:42

如何通过按钮删除对象？

相关推荐