如何通过Java脚本动态移除表单元素？-前端问题

How can dynamically remove element of form by Javascript?(如何通过Java脚本动态移除表单元素？)

本文介绍了如何通过Java脚本动态移除表单元素？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我用Java脚本制作了一个带有动态元素的表单。我可以添加元素，但如何从表单中删除它们？我解决不了问题。我糊涂了！：(

我的代码：数据-lang="js"数据-隐藏="假"数据-控制台="假"数据-巴贝尔="假">

<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="ZGVs" src="aW1hZ2VzL2RlbC5naWY=" />';
  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="YWRk" src="aW1hZ2VzL2FkZC5naWY=" onclick="addElement('h125');" />
            </div>
        </div>
    </div>
    </form>

推荐答案

这是您试图实现的目标吗？如果是，当您在removeElement函数中混淆ID时。

//+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="ZGVs" src="aW1hZ2VzL2RlbC5naWY=" />';
  ni.appendChild(newdiv);
}
//-Element
function removeElement(divNum,div) {
  var d = document.getElementById(divNum);
  var olddiv = document.getElementById(div);
  d.removeChild(olddiv);
}

<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="YWRk" src="aW1hZ2VzL2FkZC5naWY=" onclick="addElement('h125');" />
            </div>
        </div>
    </div>
    </form>

这篇关于如何通过Java脚本动态移除表单元素？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持编程学习网！