Question

我正在使用dropzonejs上传和删除服务器上的多个图像。上传多个图像工作正常，但一次删除图像导致我的问题。在单击删除链接时，所有与图像关联的ajax函数会同时触发，这会导致删除所有文件而不是选择文件。如何区分删除链接与每个相关的图像文件???

jQuery(function () {
    var articleID = jQuery('#articleID').val();
    Dropzone.autoDiscover = false;
    var myDropzone = new Dropzone('#media-uploader', {
        url: "url?action=kl_upload_article_images",
        acceptedFiles: 'image/*',
        maxFilesize: 50,
        previewTemplate: $('#preview-template').html(),
        thumbnailHeight: 120,
        thumbnailWidth: 120,
        parallelUploads: 100,
        uploadMultiple: true,
        autoProcessQueue: false,
        addRemoveLinks: true,
        autoProcessQueue: false,
        init: function ()
        {
            dropZoneObject = this;
            //getting file name and directory to preview stored images in dropzonejs
            $.get("url?action=kl_edit_article_images&article_id=" + articleID, function (data)
            {
                //loopging through each data to preview images 
                $.each(data, function (key, value)
                {
                    var mockFile = {name: value.name, size: value.size};
                    dropZoneObject.emit("addedfile", mockFile);
                    var fileUrl = 'fileDirectory/'; ? > '+value.name;
                            dropZoneObject.emit("thumbnail", mockFile, fileUrl);
                    dropZoneObject.emit("complete", mockFile);
                    //@start of removing file
                    dropZoneObject.on("removedfile", function (file)
                    {
                        $.post("url?action=kl_delete_article_images&image_name=" + value.name + "&article_id=" + articleID);
                    });
                    //@end of removing file
                });
                dropZoneObject.on('sending', function (file, xhr, formData)
                {
                    formData.append('articleId', articleID);
                });
            });
        }
    });
});

Answer 1

不管怎么说，由于这些问题，我已经弄清楚要从服务器删除文件了 link1 link2。我已经发布了我的代码的最终结果。希望它会帮助别人。

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
      <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

    <table cellpadding="0" cellspacing="5" id="mainmenu">
        <tbody>
            <tr>
                <td valign="top" class="menu_sub">
                    something 1
                </td>
                <td valign="top" class="menu_sub">
                    something 2
                </td>
                <td valign="top" class="menu_sub">
                    something 3
                </td>
            </tr>
             <tr>
                <td valign="top" class="menu_sub">
                    something 11
                </td>
                <td valign="top" class="menu_sub">
                    something 22
                </td>
                <td valign="top" class="menu_sub">
                    something 33
                </td>
            </tr>
             <tr>
                <td valign="top" class="menu_sub">
                    something 11
                </td>
                <td valign="top" class="menu_sub">
                    something 22
                </td>
                <td valign="top" class="menu_sub">
                    something 33
                </td>
            </tr>
        </tbody>
    </table>

dropzonejs一次一个地手动删除服务器上的文件

1 个答案: