记在学习编程中的问题

当有多个上传项目时，如：

1.上传1PDF文件

2.上传2PDF文件

3上传3PDF文件

为了方便，我一开始直接copy的一模一样的代码，三个上传显示文件的代码都是用的一样的id，导致在删除该条记录时，会出现

“Failed to execute 'removeChild' on 'Node': parameter 1 is not of type 'Node'.”

的错误。

当我将三个id分别区分，同时写了三个删除函数后，问题解决。

原先的代码

//第一个上传显示文件
<div id="ceshi_pdf">
    <input onclick="showDialog1(this.src)" src="/importPDf/测试pdf文件1.pdf" id="htname_pdfid1" class="btn btn-primary" name="htpdf1" type="button" value="测试pdf文件1.pdf" style="margin-left: 10px; margin-top: 10px; margin-right: 20px; width: 150px">
    <input name="htpdf1" id="htpdf_id1" type="hidden" value="/importPDf/测试pdf文件1.pdf">
    <input type="button" id="htdelete_id1" value="删除" class="btn btn-primary" style="margin-left: 10px; margin-top: 10px; margin-right: 20px;" onclick="deletebtn(htdelete_id1,htpdf_id1,htname_pdfid1)">                                            
    <br>
</div>

//第二个上传显示文件
<div id="ceshi_pdf">
    <input onclick="showDialog1(this.src)" src="/importPDf/测试pdf文件1.pdf" id="htname_pdfid1" class="btn btn-primary" name="htpdf1" type="button" value="测试pdf文件1.pdf" style="margin-left: 10px; margin-top: 10px; margin-right: 20px; width: 150px">
    <input name="htpdf1" id="htpdf_id1" type="hidden" value="/importPDf/测试pdf文件1.pdf">
    <input type="button" id="htdelete_id1" value="删除" class="btn btn-primary" style="margin-left: 10px; margin-top: 10px; margin-right: 20px;" onclick="deletebtn(htdelete_id1,htpdf_id1,htname_pdfid1)">                                            
    <br>
</div>

//第三个上传显示文件
<div id="ceshi_pdf">
    <input onclick="showDialog1(this.src)" src="/importPDf/测试pdf文件1.pdf" id="htname_pdfid1" class="btn btn-primary" name="htpdf1" type="button" value="测试pdf文件1.pdf" style="margin-left: 10px; margin-top: 10px; margin-right: 20px; width: 150px">
    <input name="htpdf1" id="htpdf_id1" type="hidden" value="/importPDf/测试pdf文件1.pdf">
    <input type="button" id="htdelete_id1" value="删除" class="btn btn-primary" style="margin-left: 10px; margin-top: 10px; margin-right: 20px;" onclick="deletebtn(htdelete_id1,htpdf_id1,htname_pdfid1)">                                            
    <br>
</div>

//删除
<script type="text/javascript">

    var ceshi_pdf = document.getElementById("ceshi_pdf");

    function deletebtn(delete_id, pdf_id, name_pdfid) {
        ceshi_pdf.removeChild(delete_id);
        ceshi_pdf.removeChild(pdf_id);
        ceshi_pdf.removeChild(name_pdfid);
    }

</script>

修改后的代码

//第一个上传显示
<div id="ceshi_pdf">
    <input onclick="showDialog1(this.src)" src="/importPDf/测试pdf文件1.pdf" id="htname_pdfid1" class="btn btn-primary" name="htpdf1" type="button" value="测试pdf文件1.pdf" style="margin-left: 10px; margin-top: 10px; margin-right: 20px; width: 150px">
    <input name="htpdf1" id="htpdf_id1" type="hidden" value="/importPDf/测试pdf文件1.pdf">
    <input type="button" id="htdelete_id1" value="删除" class="btn btn-primary" style="margin-left: 10px; margin-top: 10px; margin-right: 20px;" onclick="deletebtn(htdelete_id1,htpdf_id1,htname_pdfid1)">                                            
    <br>
</div>

//第二个上传显示
<div id="cgbtn_pdf">                                                   
    <input onclick="showDialog1(this.src)" src="/importPDf/测试pdf文件1.pdff" id="cgname_pdfid1" class="btn btn-primary" name="cgpdf1" type="button" value="测试pdf文件1.pdf" style="margin-left: 10px;  margin-right: 20px;width:150px">                                             
    <input name="cgpdf1" id="cgpdf_id1" type="hidden" value="/importPDf/测试pdf文件1.pdf">                                            
    <input type="button" id="cgdelete_id1" value="删除" class="btn btn-primary" style="margin-left: 10px; margin-top: 10px; margin-right: 20px;" onclick="cgdeletebtn(cgdelete_id1,cgpdf_id1,cgname_pdfid1)">                                                    
    <br>                                                                               
</div>

//第三个上传显示
<div id="zfbtn_pdf">
    <input onclick="showDialog1(this.src)" src="/importPDf/测试pdf文件1.pdf" id="zfname_pdfid1" class="btn btn-primary" name="zfpdf1" type="button" value="测试pdf文件1.pdf" style="margin-left: 10px;  margin-right: 20px;width:150px">
    <input name="zfpdf1" id="zfpdf_id1" type="hidden" value="/importPDf/测试pdf文件1.pdf">
    <input type="button" id="zfdelete_id1" value="删除" class="btn btn-primary" style="margin-left: 10px; margin-top: 10px; margin-right: 20px;" onclick="zfdeletebtn(zfdelete_id1,zfpdf_id1,zfname_pdfid1)">
    <br>            
</div>

//删除
<script type="text/javascript">

    var ceshi_pdf = document.getElementById("ceshi_pdf");

    function deletebtn(delete_id, pdf_id, name_pdfid) {
        ceshi_pdf.removeChild(delete_id);
        ceshi_pdf.removeChild(pdf_id);
        ceshi_pdf.removeChild(name_pdfid);
    }

</script>
<script type="text/javascript">

    var cgbtn_pdf = document.getElementById("cgbtn_pdf");

    function cgdeletebtn(delete_id, pdf_id, name_pdfid) {
        cgbtn_pdf.removeChild(delete_id);
        cgbtn_pdf.removeChild(pdf_id);
        cgbtn_pdf.removeChild(name_pdfid);
    }

</script>

<script type="text/javascript">

    var zfbtn_pdf = document.getElementById("zfbtn_pdf");

    function zfdeletebtn(delete_id, pdf_id, name_pdfid) {
        zfbtn_pdf.removeChild(delete_id);
        zfbtn_pdf.removeChild(pdf_id);
        zfbtn_pdf.removeChild(name_pdfid);
    }

</script>