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="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>
推荐答案
这是您试图实现的目标吗?如果是,当您在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="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);
}
<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>
这篇关于如何通过Java脚本动态移除表单元素?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!
织梦狗教程
本文标题为:如何通过Java脚本动态移除表单元素?


基础教程推荐
猜你喜欢
- Bokeh Div文本对齐 2022-01-01
- 在 contenteditable 中精确拖放 2022-01-01
- npm start 错误与 create-react-app 2022-01-01
- Fabric JS绘制具有活动形状的多边形 2022-01-01
- 如何添加到目前为止的天数? 2022-01-01
- fetch 是否支持原生多文件上传? 2022-01-01
- 原生拖动事件后如何获取 mouseup 事件? 2022-01-01
- 即使用户允许,Gmail 也会隐藏外部电子邮件图片 2022-01-01
- 检查 HTML5 拖放文件类型 2022-01-01
- Bootstrap 模态出现在背景下 2022-01-01