Question

我用这个值（“+”和“ - ”）构建了两个按钮当我点击“+”时，它会创建一个文本和组合框，我想知道如何用“ - ”按钮删除它们（仅限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>

Answer 1

    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供您参考

Answer 2

我的解决方案：

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/

如何通过按钮删除对象？

2 个答案: