javascript - 关于文本框中未显示的多个文件输入和路径丢失

Question

我正在使用 JavaScript 在一个表单中添加多个表单，存在一个问题，即当我将路径文件添加到 fileinput 以获取重复表单时，它的路径未显示。

这是 javascript thorugh，我正在复制表单。

var count=0;

$(document).on("click", "#addanother", function(){
    count=count+1;


    $(".content #formImage:last").append('<br>');

    divcontent='<form id="formImage'+count+'" name="formImage[]">'+
    '<input type="hidden" id="api'+count+'" name="api" value="addImageInPack" />'+
    '<input type="hidden" id="imageusername'+count+'" name="username" value="" />'+
'<input type="hidden" id="imagepassword'+count+'" name="password" value="" />'+
    '<table width="100%" style="border:2px solid #ffffffl;" id="multipleImages'+count+'" >'+
    '<tbody>'+
    '<tr><td><label for="imagetitle">Title (Optional)</label></td>'+
    '<td><span id="remove" style="cursor:pointer;"><img src="img/cross.png" width="10px" style="float: right; right:0;" /></span><br />'+
    '<input type="text" id="imagetitle'+count+'" name="title[]" style="width:100%" /></td>'+
    '</tr>'+
    '<tr>'+
    '<td><label for="imagetags" style="width:100%">Tags</label></td>'+
    '<td><input type="text" id="imagetags'+count+'" name="tags[]" style="width:100%" /></td>'+
    '</tr>'+
    '<tr>'+
    '<td><label for="imagedescription" style="width:100%">Description (Optional)</label></td>'+
    '<td><textarea id="imagedescription'+count+'" name="description[]" style="width:100%"></textarea></td>'+
    '</tr>'+
    '<tr>'+
    '<td><label for="imagepackid" style="width:100%">Pack</label></td>'+
    '<td><select id="imagepackid'+count+'" name="packid[]" style="width:100%">'+"'<?php echo $server->getPackOptions() ?>+'"+'</select></td>'+
    '</tr>'+
    '<tr>'+
    '<td><label for="file">Image:</label></td>'+
    '<td>'+
    '<input class="file" style="display: inline; width: 150px;">'+
    '<div class="file-btn" style="width: 85px; height: 28px; display: inline; position: absolute; overflow: hidden; cursor: pointer; background-position: 100% 50%;">'+
    '<input type="file" name="file" id="image" style="position: relative; height: 28px; width: 150px; display: inline; cursor: pointer; opacity: 0; margin-left: -65px;">'+
    '</div>'+
    '<img src="img/uploadIcon.png" width="20px">'+
    '</td>'+
    '</tr>'+
    '</tbody>'+
    '</table>'+
    '</form>';



    jQuery('.content #formImage').append(divcontent);
}); 

这是原始的html代码：

<form id="formImage" name="formImage[]">
                        <input type="hidden" id="api" name="api" value="addImageInPack" />
                        <input type="hidden" id="imageusername" name="username" value="" />
                        <input type="hidden" id="imagepassword" name="password" value="" />
                        <table width="100%" style="border:2px solid #ffffffl;" id="multipleImages" >
                        <tbody>

                            <tr>
                            <td><label for="imagetitle">Title (Optional)</label></td>
                            <td>
                            <span id="remove" style="cursor:pointer;"><img src='img/cross.png' width='10px' style="float: right; right:0;" /></span>
                            <br />
                            <input type="text" id="imagetitle" name="title[]" style="width:100%" /></td>
                            </tr>
                            <tr>
                            <td><label for="imagetags" style="width:100%">Tags</label></td> 
                            <td><input type="text" id="imagetags" name="tags[]" style="width:100%" /></td>
                            </tr>
                            <tr>
                            <td><label for="imagedescription" style="width:100%">Description (Optional)</label></td>
                            <td><textarea id="imagedescription" name="description[]" style="width:100%"></textarea></td>
                            </tr>
                            <tr>
                            <td><label for="imagepackid" style="width:100%">Pack</label></td>
                            <td><select id="imagepackid" name="packid[]" style="width:100%"><?php echo $server->getPackOptions() ?></select></td>
                            </tr>
                            <tr>
                            <td><label for="file">Image:</label></td>
                            <td>
                                <input type="file" name="file[]" id="image"/>
                                <img src="img/uploadIcon.png" width="20px"/>

                             </td>
                        </tr>
                        </tbody>
                        </table>
                    </form>

问题解释为在上传图像时未显示第二个输入文件路径。

第二个问题是我想通过 javascript 点击按钮时删除这个动态创建的表单。如何做到这一点。感谢您提前提供帮助。