Question

我正在尝试在dropzone上实现removefile。我正在使用rails，为了实现这一点，我必须在我的dz-remove类中添加id = 1属性。

这是我目前的代码：

    var dropzone = new Dropzone ("#my-dropzone", {
        maxFiles: 50,
        maxFilesize: 30,
        paramName: "album[images][]",
        addRemoveLinks: true,
        uploadMultiple: true,
        autoProcessQueue: false,
        parallelUploads: 10,
        processing: function(){
                dropzone.options.autoProcessQueue = true;},
        init: function(){
              var thisDropZone = this;
              $.getJSON('image_list', function(data) {
                $.each(data, function(index, val) {
                      var mockFile = { name: val.name, size: val.size };
                      thisDropZone.emit("addedfile", mockFile);
                      thisDropZone.emit("thumbnail", mockFile, val.path);
                      thisDropZone.emit("complete", mockFile);
                    });
                });
              }

我试过这段代码：

    success: function(file, response){
                $(file.previewTemplate).find('.dz-remove').attr('id', response.fileID);
                $(file.previewElement).addClass("dz-success");
            }

fileID来自我的图片控制器：

if @picture.save
  render json: { message: "success", fileID: @picture.id }, :status => 200
else

它可以工作但是，当我刷新浏览器时，属性id = 1消失了。我还想分开上传和编辑页面。

我还尝试使用以下代码从json文件中获取id值：

init: function(){
    var thisDropZone = this;
    $.getJSON('image_list', function(data) {
       $.each(data, function(index, val) {
           var mockFile = { name: val.name, size: val.size };
           thisDropZone.emit("addedfile", mockFile);
           thisDropZone.emit("thumbnail", mockFile, val.path);
           thisDropZone.emit("complete", mockFile);

           $(".dz-remove").attr("id", val.id);
        });
    });
}

这又有效，并为我的html添加了永久id = 1属性。但是附加的val.id是不变的。例如，如果我有3张图片：

<a href="javascript:undefined;" class: "dz-remove" data-dz-remove id="1">Remove</a>
<a href="javascript:undefined;" class: "dz-remove" data-dz-remove id="1">Remove</a>
<a href="javascript:undefined;" class: "dz-remove" data-dz-remove id="1">Remove</a>

我想要的输出是：

<a href="javascript:undefined;" class: "dz-remove" data-dz-remove id="1">Remove</a>
<a href="javascript:undefined;" class: "dz-remove" data-dz-remove id="2">Remove</a>
<a href="javascript:undefined;" class: "dz-remove" data-dz-remove id="3">Remove</a>

我也试过$(".dz-remove").each，但价值仍然是常数而不是动态的。我也很困惑，因为我做console.log($(".dz-remove").attr("id", val.id))控制台值正确附加（id=1, id=2, id=3）。在html上我得到的是id=1。

Answer 1

更改$（＆＃34; .dz-remove＆＃34;）。attr（＆＃34; id＆＃34;，val.id）;至 $（＆＃34; .dz-remove＆＃34;）。eq（index）.attr（＆＃34; id＆＃34;，val.id）;

$（＆＃34; .dz-remove＆＃34;）返回元素数组，你想要将id添加到current，使用eq（元素索引）

Dropzone将动态属性附加到#dz-remove

1 个答案: