복수 인스턴스가 포함 된 파일 업로드 파일

Question

valums fileuploader과 함께 여러 인스턴스를 사용하고 있지만 업 로더는 모든 인스턴스에 대해 마지막 설정 만 사용하는 것으로 보입니다.이를 피하고 로컬 설정을 사용하는 옵션이 있습니까? 업로드는 올바르게 진행되지만, initializeUploader 내부의 요소는 사용중인 인스턴스에 관계없이 항상 동일합니다.

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 
    }); 
}; 

Answer 1

나는 똑같은 문제에 직면 해있다. 내 문제를 해결하기 위해이 트릭을 사용했습니다.

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

조건문을 사용하여 함수를로드하고 특정 매개 변수를 함수에 전달했습니다. 도움이 되길 바랍니다.

Answer 2

initializeUploader에서 element 및 uploader 변수는 전역 변수입니다.

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

같은 것들을 호출 될 때 그래서, element로 설정 마지막 값에 호출 할 것입니다. "var"를 사용하여 지역 변수를 캡처하여 사용하십시오.