Javascript 通过jquery动态添加/删除显示错误计数的输入字段为什么可以'；没人能解决这个问题吗？

我有多个文件上传，在这里我显示的文件计数和文件大小（最大3GB）同时上传，而删除文件，我无法更新剩余的文件计数和文件大小

注意：如果我删除并添加了更多文件，那么也会显示错误的计数

这是代码

<span class="form-field" style="margin-top:28px;">       
            <p class="contact"><label for="">File attachments</label></p> 
            <div class="image-upload" id="image-upload">
                <span id="file_labels_div">                
                    <div class="div-file" id="div-file-1">
                        <label for="input-file-1" style="cursor: pointer;">
                            <img style="vertical-align:middle; margin-right: 15px;" width="50px" id="fileupload-attachments" src="<?= SITE_URL ?>views/images/plus_icon.png" /> FILE ATTACHMENTS UP TO 3GB 
                        </label>
                        <input id="input-file-1" name="projectfiles[]" inc="1" onchange="getFileName(this);"  style="cursor: pointer; visibility: hidden;" type="file"/>
                    </div>
                </span>
                <div class="all-filenames-span" id="all-filenames"></div>
            </div>
</span> 

文件附件
视图/images/plus_icon.png“/>文件附件高达3GB

这是我的jquery/Javascript代码

var SITE_URL = "";
var increaseFile = 2, filecheck = 1, filesize = 0, total_file_size = '';
function getFileName(fileobj) {

    checkfiles();
    if (filesize > 3204448256) {
        alert('Your files contains more than 3GB..please upload upto 3GB')
    }

    if (filecheck == 2) {
        $("#div-file-" + $("#" + fileobj.id + "").attr('inc')).hide();
        $("#file_labels_div").append('<div class="div-file" id="div-file-' + increaseFile + '"><label for="input-file-' + increaseFile + '"><img style="vertical-align:middle; margin-right: 15px;" id="fileupload-attachments" src="' + SITE_URL + 'views/images/plus_icon.png" width="50px" /><span id="img_label" >' + total_file_size + '</span></label><input id="input-file-' + increaseFile + '" name="projectfiles[]" inc="' + increaseFile + '" onchange="getFileName(this);"  style="display:none;" type="file"/></div>');
        increaseFile++;
    } else {
        $("#file_labels_div").html('<div class="div-file" id="div-file-1"><label for="input-file-1"><img style="vertical-align:middle; margin-right: 15px;" id="fileupload-attachments" src="' + SITE_URL + 'views/images/plus_icon.png" width="50px" /><span id="img_label" >FILE ATTACHMENTS UP TO 3GB</span></label><input id="input-file-1" name="projectfiles[]" inc="1" onchange="getFileName(this);"  style="display:none;" type="file"/></div><span id="all-filenames"></span>');
        increaseFile = 2;
        filesize = 0;
    }
}


function checkfiles() {
    //file_names='<span id="all-filenames">';
    file_names = '';
    filesize = 0;
    filecheck = 1;

    for (fcheck = 0; fcheck < increaseFile; fcheck++) {
        if ($('#div-file-' + fcheck).length > 0)
        {

            var x = document.getElementById("input-file-" + fcheck);
            var txt = "";
            myFile = "input-file-" + fcheck + "";
            if ('files' in x) {
                //alert(x.files.length)
                if (x.files.length == 0) {
                    txt = "Select one or more files.";
                } else {

                    filecheck = 2;
                    for (var i = 0; i < x.files.length; i++) {
                        //txt += "<br><strong>" + (i+1) + ". file</strong><br>";
                        var file = x.files[i];
                        if ('name' in file) {
                            // txt += "name: " + file.name + "<br>";
                            if (filesize > 3204448256)
                            {
                                $("#all-filenames").html(file_names);
                                //alert("You have exceeded maximum allowed size 3GB")
                                return true;
                            }

                            if ('size' in file) {
                                var sizeInMB = (file.size / (1024 * 1024)).toFixed(2);
                            }

                            //alert(sizeInMB + 'MB');

                            // file_names+='<span onmouseover=\'$("#closebtn-'+fcheck+'").show()\' onmouseout=\'$("#closebtn-'+fcheck+'").hide()\' id="singlefile-'+fcheck+'">'+file.name+' ('+sizeInMB+'MB) <img id="closebtn-'+fcheck+'"  src="images/x-close_btn.png" style="cursor:pointer;/*display:none;*/vertical-align: bottom;padding-left: 3px;" onclick=deletefile("singlefile-'+fcheck+'","#div-file-'+fcheck+'") /> <br></span>';
                            file_names += '<div class="singlefile"  id="singlefile-' + fcheck + '"><img id="closebtn-' + fcheck + '"  src="' + SITE_URL + 'views/images/close_icon@2x.png" width="50px" style="cursor:pointer;/*display:none;*/vertical-align: middle;padding-left: 12px; margin-right: 18px; width: 15px;" onclick=deletefile("singlefile-' + fcheck + '","#div-file-' + fcheck + '") />' + file.name + ' (' + sizeInMB + 'MB)<br></div><input id="input-file-' + increaseFile + '" name="projectfiles[]" inc="' + increaseFile + '" onchange="getFileName(this);"  style="display:none;" type="file"/>';
                        }
                        if ('size' in file) {
                            // txt += "size: " + file.size + " bytes <br>";
                            filesize += file.size
                        }
                    }
                }
            }

            //file_names+='</span>';

            //$( "span" ).remove( "#all-filenames" );
            //  $("#all-filenames").remove();

            $("#all-filenames").html(file_names)
            //  alert('>>>'+txt)

        }
    }

    var sizeInMB = (filesize / (1024 * 1024)).toFixed(2);
    total_file_size = (fcheck - 1) + " ATTACHMENTS / (" + (3000 - sizeInMB) + "MB REMAINING)";
//              $("#div-file-"+fcheck).html(total_file_size)    


}

function deletefile(filename, divname)
{
//  alert('file name is'+filename+"divname"+divname)
    $('#' + filename).remove();
    $(divname).remove();

    checkfiles();
    if (filecheck == 1)
    {
        $("#file_labels_div").html('<div class="div-file" id="div-file-1"><label for="input-file-1"><img style="vertical-align:middle; margin-right: 15px;" id="fileupload-attachments" src="' + SITE_URL + 'views/images/plus_icon.png" width="50px" /> FILE ATTACHMENTS UP TO 3GB</label><input id="input-file-1" name="projectfiles[]" inc="1" onchange="getFileName(this);"  style="visibility: hidden;" type="file"/></div>');
        $('#image-upload').append('<div class="all-filenames-span" id="all-filenames"></div>');
        increaseFile = 2;
        filesize = 0;
    }

}

var SITE_URL=”“；
var increaseFile=2，filecheck=1，filesize=0，total\u file\u size=''；
函数getFileName（fileobj）{
检查文件（）；
如果（文件大小>3204448256）{
警报（'您的文件包含超过3GB的内容。请上载到3GB'）
}
if（filecheck==2）{
$（“#div file-”++$（“#“+fileobj.id+）.attr（'inc'））.hide（）；
$（“#file_labels_div”）。追加（“”+总文件大小+“”）；
增量文件++；
}否则{
$（“#file_labels_div”）.html（'高达3GB的文件附件'）；
增量文件=2；
filesize=0；
}
}
函数checkfiles（）{
//文件名=“”；
文件名=“”；
filesize=0；
filecheck=1；
对于（fcheck=0；fcheck0）
{
var x=document.getElementById（“输入文件-”+fcheck）；
var txt=“”；
myFile=“输入文件-”+fcheck+”；
if（'x中的“文件”）{
//警报（x.files.length）
如果（x.files.length==0）{
txt=“选择一个或多个文件。”；
}否则{
filecheck=2；
对于（var i=0；i”+（i+1）+“。文件
”；
var file=x.files[i]；
如果（文件中的“名称”）{
//txt+=“名称：”+file.name+“
”；
如果（文件大小>3204448256）
{
$（“#所有文件名”）.html（文件名）；
//警报（“您已超过允许的最大大小3GB”）
返回true；
}
如果（文件中的“大小”）{
var sizeInMB=（file.size/（1024*1024））.toFixed（2）；
}
//警报（sizeInMB+‘MB’）；
//文件名+=''+文件名+'（'+sizeInMB+'MB）
'；
文件名+=''+file.name+'（'+sizeInMB+'MB）
'；
}
如果（文件中的“大小”）{
//txt+=“大小：”+file.size+“字节数
”；
filesize+=file.size
}
}
}
}
//文件名+=''；
//$（“span”）。删除（“所有文件名”）；
//$（“#所有文件名”）.remove（）；
$（“#所有文件名”）.html（文件名）
//警报（'>>'+txt）
}
}
var sizeInMB=（filesize/（1024*1024））.toFixed（2）；
总文件大小=（fcheck-1）+“附件/（+（3000-sizeInMB）+“剩余MB”）；
//$（“#div file-”+fcheck）.html（总文件大小）
}
函数deletefile（文件名，divname）
{
//警报（'文件名为'+filename+“divname”+divname）
$（'#'+文件名）.remove（）；
$（divname）.remove（）；
检查文件（）；
if（filecheck==1）
{
$（“#file_labels_div”）.html（‘高达3GB的文件附件’）；
$（'#图像上载'）。附加（''）；
增量文件=2；
filesize=0；
}
}

谢谢你的建议 这是工作的小提琴代码

---

你最好将代码添加到在线服务中。（例如）嗨@MarinosAn，我在fiddle中更新了我的代码。当我去fiddle时，它说页面没有更新，你能检查一下吗exist@Chris，我已经更新了小提琴，请检查它的外部错误404我们真的很抱歉，但没有这样的页面。