使用javascript删除特定的表单元素

Removing specific form element using javascript

本文关键字：表单 元素 javascript 删除 使用      更新时间：2023-09-26

我正在尝试使用javascript创建以删除表单元素。当我移除一个元素时，它会移除最上面的元素。我正在尝试删除一个特定元素。这是该页面的链接，下面是代码。任何帮助都将不胜感激，谢谢！http://training.cvrc.virginia.edu/test.html

<script type="text/javascript">
var patient = 0;
function add_patient() {
patient++;
   var add= document.createElement('patientdiv');
   add.innerHTML += "<div id=removepatient></br>Patient "+patient+" Name/ID:<input type=text name=patients[] ><input type=button id=more_fields onclick=removepatient(); value='Remove' ></div>";
   document.getElementById('patientdiv').appendChild(add);
   return false;
}
function removepatient() {
    var elem = document.getElementById('removepatient');
   elem.parentNode.removeChild(elem);
   return false;
}
</script>

<div id=patientdiv></div>
<input type=button id=more_fields onclick=add_patient(); value='Add Patient'></br></br>

您应该为添加到页面中的每个元素生成一个唯一的ID。您可以使用一个变量，并在每次添加元素时递增该变量。在您的示例中，变量"patient"就足够了。

add.innerHTML += "<div id=removepatient_"+patient"></br>Patient "+patient+" Name/ID:<input type=text name=patients[] ><input type=button id=more_fields"+patient+" onclick=removepatient("+patient+"); value='Remove' ></div>";

您还必须在删除函数中添加一个参数：

function removepatient(patient) {
    var elem = document.getElementById('removepatient_'+patient);
   elem.parentNode.removeChild(elem);
   return false;
}

我希望它能帮助你

相关文章：