使用Javascript删除动态元素

时间:2016-04-12 13:44:01

标签: javascript elements

我用Javascript制作一个包含动态元素的表单。 我可以添加但是我无法删除! 我无法解决问题。我糊涂了! :(

我的代码:

<script type="text/javascript">
//+Element
function addElement(div) {
  var ni = document.getElementById(div);
  var numi = document.getElementById('numVal');
  var num = (document.getElementById('numVal').value -1)+ 2;
  numi.value = num;
  var newdiv = document.createElement('div');
  newdiv.setAttribute('id',num);
  var unum="'"+div+"','"+num+"'";
  newdiv.innerHTML ='<input id="t" type="tel" placeholder="Tel.'+num+'" name="t'+num+1+'"><img id="del" onClick="removeElement('+unum+');" alt="del" src="images/del.gif" />';
  ni.appendChild(newdiv);
}
//-Element
function removeElement(divNum,div) {
  var d = document.getElementById(div);
  var olddiv = document.getElementById(divNum);
  d.removeChild(olddiv);
}
</script>

    <form>
    <input type="hidden" value="0" id="numVal" />
    <div id="m">
        <div id="h125">
            <div class="fb">
                <input id="t" type="tel" placeholder="Tel.">
                <img id="add" Alt="add" src="images/add.gif" onclick="addElement('h125');" />
            </div>
        </div>
    </div>
    </form>

由于

2 个答案:

答案 0 :(得分:2)

这是你想要达到的目标吗?如果是这样,当你在removeElement函数中混合id时。

&#13;
&#13;
//+Element
function addElement(div) {
  var ni = document.getElementById(div);
  var numi = document.getElementById('numVal');
  var num = (document.getElementById('numVal').value -1)+ 2;
  numi.value = num;
  var newdiv = document.createElement('div');
  newdiv.setAttribute('id',num);
  var unum="'"+div+"','"+num+"'";
  newdiv.innerHTML ='<input id="t" type="tel" placeholder="Tel.'+num+'" name="t'+num+1+'"><img id="del" onClick="removeElement('+unum+');" alt="del" src="images/del.gif" />';
  ni.appendChild(newdiv);
}
//-Element
function removeElement(divNum,div) {
  var d = document.getElementById(divNum);
  var olddiv = document.getElementById(div);
  d.removeChild(olddiv);
}
&#13;
<form>
    <input type="hidden" value="0" id="numVal" />
    <div id="m">
        <div id="h125">
            <div class="fb">
                <input id="t" type="tel" placeholder="Tel.">
                <img id="add" Alt="add" src="images/add.gif" onclick="addElement('h125');" />
            </div>
        </div>
    </div>
    </form>
&#13;
&#13;
&#13;

答案 1 :(得分:1)

document.getElementsById(divNum); 应阅读:document.getElementById(divNum);

您需要删除&#39;&#39;元素之后。  的更新 对不起,在我回答之前我没有测试过。当您在var unum函数中声明addElement(div)时,您的变量名称会向后移动。它应该是var unum="'"+num+"','"+div+"'";