Valums fileuploader与多个实例

2012-02-15 83 views 2 likes

Im使用valums fileuploader多个实例，但似乎上传只使用每个实例的最后设置，有没有一个选项来避免这种情况，并使用本地设置？正确的实例上传效果不错，但initializeUploader中的元素总是相同的，无论我使用哪个实例。Valums fileuploader与多个实例

jQuery(function() { 
    $("[rel='uploadable']").each(function(){ 
     initializeUploader($(this).attr("id")) 
    }) 
}); 
function initializeUploader(anchor) { 
    element = document.getElementById(anchor) 
    uploader = new qq.FileUploader({ 
     element: element, 
     action: element.getAttribute("data-upload-path"), 
     allowedExtensions: ["png", "gif", "jpg", "jpeg"], 
     params: { 
      authenticity_token: $("meta[name=csrf-token]").attr("content") 
     }, 
     onSubmit: function(id, fileName){ 
      console.log ($(element)) 
      $(element).append("<span class='image'><div id='progress-" + id + "'></div></span>") 
     }, 
     onProgress: function(id, fileName, loaded, total){ 
      var progress = (loaded/total) * 100; 
      $("#progress-" + id).progressbar({value: progress}) 
     }, 
     onComplete: function(id, fileName, responseJSON){ 
      image_url = "" 
      $.each(responseJSON, function(key, item) { 
       if (key == "url") 
        image_url = item 
      }); 

      $("#progress-" + id).remove(); 
      console.log($(element).parent()) 
      console.log($(element).closest(".quanta")) 
      console.log(image_url) 
      $(element).closest(".quanta").css({'width': '300px', 'height': '300px', 'background-color': '', 'background-image': 'url(' + image_url + ')', 'background-size': '100% 100%'}) 
     }, 
     debug: true 
    }); 
};

来源

2012-02-15 Mikhail Nikalyukin

回答

我面临同样的问题。为了解决我的问题，我使用了这个技巧。

 $('a[href="#tabpdf"]').livequery('click', function() { 
      initializeUploader($('#pdfuploader')[0]); 
     }); 
     $('a[href="#tabphotos"]').livequery('click', function() { 
      initializeUploader($('#photouploader')[0]); 
     });

我使用条件语句来加载函数，并且我将特定的参数传递给函数。希望它有帮助。

来源

2012-03-08 00:26:55 Kamagatos

在initializeUploader中，您的element和uploader变量是全局变量。所以像

... 
    onSubmit: function(id, fileName){ 
     console.log ($(element)) 
     $(element).append("<span class='image'><div id='progress-" + id + "'></div></span>") 
    }, 
    ...

被调用时，它会调用上设置element的最后一个值。使用“var”以便捕获和使用局部变量。

来源

2012-03-08 01:02:25 JayC

Valums fileuploader与多个实例

回答

相关问题