jQuery-文件上传不断重复上传相同文件

问题场景

我以供应商模式上传文件，文件上传正常。现在，我从客户模式上传了文件（两个模式都在同一页面中），最新上传的文件（我在供应商模型中上传的文件）被重新上传。我尝试在客户模型中上传另一个文件，然后又上传了相同的文件（感觉就像我一次又一次上传相同的文件，只是我没有这样做）

MyJs文件代码

/**
     * Upload an Attachment to server
     */
    $(document).on('change','#atta_file_names_d,#rec_atta_file_names_d',function()
    {
        var elm = $(this);
        var attach_each_id = '';
        var actual_file_name_idetify = '';
        var attached_file_idetify = '';
        var apend_checkbox = '';
        var apendCheckbox='';
        if($(this).is("#rec_atta_file_names_d"))
        {
            attached_file_idetify = 'rec_attached_file';
            actual_file_name_idetify = 'rec_actual_file_name';
            attach_each_id = 'rec_atta_file_names_d'
            form_id = $('#rec_atta_file_names_d').parents().find('form').attr('id');
        }
        else
        {
            attached_file_idetify = 'attached_file';
            actual_file_name_idetify = 'actual_file_name';
            attach_each_id = 'atta_file_names_d'
            form_id = $('#atta_file_names_d').parents().find('form').attr('id');
        }

        //add checkbox in the attached image
        if($(this).hasClass("checkbox-img-d"))
        {
            apend_checkbox = 1;
        }


        var forma = $('#'+form_id)[0];
        var formd = new FormData(forma);


        // directory_upload_path = $('.directory-path-d').val();
        directory_upload_path = $(this).parents('form').find('.directory-path-d').val();
        $.each($('#'+attach_each_id).prop('files'),function(k,v)
        {
            formd.append("atta_file_names_d[]",$('#'+attach_each_id).prop('files')[k]);
        });
        formd.append("path",directory_upload_path);

        var formdata = false;

        $.ajax
        (
            {
                url: baseUrl+'upload-attachment',type: "POST",data:  formd,contentType: false,cache: false,processData:false,beforeSend : function()
                {
                    $('#'+form_id).find('.progress-bar-load-d').show();
                },success: function(res)
                {
                    validateLogin(res);

                    res = JSON.parse(res);
                    //console.log(res.success.length);
                    for(i=0; i < res.success.length; i++)
                    {
                        modified_file_name = res.success[i].success.file_name;

                        actual_file_name = res.success[i].file_name;
                        file_size = res.success[i].success.file_size;

                        if(apend_checkbox)
                        {
                            apendCheckbox = '<div class="chiller_cb"><input name="attachments" id="vat_2'+i+'" class="attach-checkbox-d" value="'+modified_file_name+'" type="checkbox"><label for="vat_2'+i+'">&nbsp;</label><span></span></div><span class="attach-email-s">Attach to email</span>';
                        }

                        append_uploaded_doc = '<div style="display: flex; align-items: center;padding: 0px 0px 0px 20px; height: 25px;">'+ apendCheckbox +'<a href="' + baseUrl + directory_upload_path + modified_file_name+'" target="_blank" class="attachment-a-s" style="font-size:13px; margin: 0px 5px 0px 20px;word-break: break-word; float: left;">' +actual_file_name +'</a><span class="file-size-s">('+file_size+')</span><a href="javascript:void(0)" class="atta-file-s" style="float: left;margin-right: 5px;"><img src=" '+ baseUrl + 'public/admin/images/attach_cross.png" /></a><input type="hidden" name="attached_file" class="'+attached_file_idetify+'" value="'+modified_file_name+'" /><input type="hidden" name="actual_file_name" class="'+actual_file_name_idetify+'" value="'+actual_file_name+'" /></div>';

                        if(attach_each_id == 'atta_file_names_d')
                        {

                            $(elm).parents('form').find('.file-content-d').append(append_uploaded_doc);
                        }
                        else
                        {
                            $(elm).parents('form').find('.rec-file-content-d').append(append_uploaded_doc);
                        }

                    }
                },error: function(e)
                {
                },complete: function (data)
                {
                    $('#'+form_id).find('.progress-bar-load-d').hide();
                }
            }
        );
        //readURL(this);
    });

我的供应商HTML代码

<div class="col-sm-12 p0">
                            <div class="form-group">
                                <div class="file-upload p0_res vendor_pad_zero">
                                    <div class="col-sm-12 p0">
                                        <button class="file-upload-btn pull-left" id="button">
                                            <label><i class="fa fa-fw fa-paperclip"></i> Attachments </label>
                                            <span class="maxsize_file">Maxmimum size 300 KB</span>
                                        </button>
                                    </div>
                                    <div class="clear5"></div>
                                    <input type="hidden" class="directory-path-d" name="dir_path" value="uploads/vendor/">
                                    <div class="image-upload-wrap image_upload_vendor_wrappp img-drag-detuct-d">
                                        <div class="file-content-d">
                                                                                    </div>
                                        <input id="atta_file_names_d" type="file" name="atta_file_names_d" class="file-upload-input" multiple="multiple" style="width:100%;">
                                        <div class="drag-text drag_vendor_texttt">
                                            <h3>Drag and drop a file here</h3>
                                        </div>
                                        <svg class="svg-progress-bar-30-right progress-bar-load-d hide-d" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200"><circle class="path-progress-bar" stroke-width="10" stroke-miterlimit="10" cx="100" cy="100" r="94"></circle></svg>
                                    </div>
                                </div>
                            </div>
                        </div>

我给客户的HTML代码

<div class="col-sm-6 p0">
                                    <div class="form-group">
                                        <div class="file-upload p0_res">
                                            <div class="col-sm-12 p0">
                                                <button class="file-upload-btn pull-left" type="button" onclick="$('.file-upload-input').trigger( 'click' )">
                                                    <label><b><i class="fa fa-fw fa-paperclip"></i> Attachments</b> </label> <span class="maxsize_file">Maxmimum size 300 KB</span> </button>
                                            </div>
                                            <div class="clear5"></div>
                                            <input type="hidden" class="directory-path-d" name="dir_path" value="uploads/customer/">
                                            <div class="image-upload-wrap image_upload_vendor_wrappp img-drag-detuct-d">
                                                <div class="file-content-d">
                                                                                                    </div>
                                               <input class="file-upload-input valid" name="atta_file_names_d" id="atta_file_names_d" type="file" multiple="multiple" aria-invalid="false">
                                                <div class="drag-text">
                                                    <h3>Drag/Drop files here or click the icon</h3>
                                                </div>
                                                <svg class="svg-progress-bar-30-right progress-bar-load-d hide-d" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200">
        <circle class="path-progress-bar" stroke-width="10" stroke-miterlimit="10" cx="100" cy="100" r="94"></circle></svg>
                                            </div>
                                        </div>
                                    </div>
                                    </div>

PS 我一切正常，我只想知道我的代码出了什么问题（我没有在此处发布不相关的代码部分）

问题出在我的Js

我已经更新了 myJs 功能，可以将服务器上的文件上传到以下位置：

    $(document).on('change','#atta_file_names_d,#rec_atta_file_names_d',function()
    {
        var elm = $(this);
        var elmId = $(elm).attr('id');
        var form_id = $(elm).parents('form').attr('id');
        var directory_upload_path = $(this).parents('form').find('.directory-path-d').val();

        var apend_checkbox = ''; // for condition validation 
        var apendCheckbox=''; // to use in append string

        // define variables to be used within appended string
        if($(elm).is("#rec_atta_file_names_d"))
        {
            attached_file_idetify = 'rec_attached_file';
            actual_file_name_idetify = 'rec_actual_file_name';
            attach_each_id = 'rec_atta_file_names_d';
        }
        else{
            attached_file_idetify = 'attached_file';
            actual_file_name_idetify = 'actual_file_name';
            attach_each_id = 'atta_file_names_d';
        }

        //add checkbox in the attached image
        if($(elm).hasClass("checkbox-img-d"))
        {
            apend_checkbox = 1;
        }

        // determine uploaded files
        var files = $(this).prop('files');
        if( files.length == 0){ // case: there is no file to upload
            console.log('no file to upload');
            return;
        }

        // setup form data for post request
        var forma = $('#'+form_id)[0];
        var formd = new FormData(forma);
        formd.append("path",directory_upload_path);
        $.each( files,function(k,v)
        {
            formd.append(elmId + '[]',files[k]);
        });

$.ajax
        (
            {
                url: baseUrl+'upload-attachment',type: "POST",data:  formd,contentType: false,cache: false,processData:false,beforeSend : function()
                {
                    $('#'+form_id).find('.progress-bar-load-d').show();
                },success: function(res)
                {
                    validateLogin(res);
                    // console.log(res);
                    res = JSON.parse(res);
                    // console.log(res);
                    for(i=0; i < res.success.length; i++)
                    {
                        modified_file_name = res.success[i].success.file_name;

                        actual_file_name = res.success[i].file_name;
                        file_size = res.success[i].success.file_size;

                        if(apend_checkbox)
                        {
                            apendCheckbox = '<div class="chiller_cb"><input name="attachments" id="vat_2'+i+'" class="attach-checkbox-d" value="'+modified_file_name+'" type="checkbox"><label for="vat_2'+i+'">&nbsp;</label><span></span></div><span class="attach-email-s">Attach to email</span>';
                        }

                        append_uploaded_doc = '<div style="display: flex; align-items: center;padding: 0px 0px 0px 20px; height: 25px;">'+ apendCheckbox +'<a href="' + baseUrl + directory_upload_path + modified_file_name+'" target="_blank" class="attachment-a-s" style="font-size:13px; margin: 0px 5px 0px 20px;word-break: break-word; float: left;">' +actual_file_name +'</a><span class="file-size-s">('+file_size+')</span><a href="javascript:void(0)" class="atta-file-s" style="float: left;margin-right: 5px;"><img src=" '+ baseUrl + 'public/admin/images/attach_cross.png" /></a><input type="hidden" name="attached_file" class="'+attached_file_idetify+'" value="'+modified_file_name+'" /><input type="hidden" name="actual_file_name" class="'+actual_file_name_idetify+'" value="'+actual_file_name+'" /></div>';

                        if(attach_each_id == 'atta_file_names_d')
                        {

                            $(elm).parents('form').find('.file-content-d').append(append_uploaded_doc);
                        }
                        else
                        {
                            $(elm).parents('form').find('.rec-file-content-d').append(append_uploaded_doc);
                        }

                    }
                },error: function(e)
                {
                },complete: function (data)
                {
                    $('#'+form_id).find('.progress-bar-load-d').hide();
                }
            }
        );
    });

jQuery-文件上传不断重复上传相同文件

jiancha471 回答：jQuery-文件上传不断重复上传相同文件

大家都在问