2016-02-25 4 views
1

Я использую плагин Fine Uploader 5 для загрузки изображений, и мне нужно получить идентификатор изображения при его загрузке.Получить идентификатор динамически добавленного изображения

Мой код:

<script type="text/template" id="qq-template-gallery"> 
    <div class="qq-uploader-selector qq-uploader qq-gallery" qq-drop-area-text="Drop files here"> 
     <div class="qq-total-progress-bar-container-selector qq-total-progress-bar-container"> 
      <div role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" class="qq-total-progress-bar-selector qq-progress-bar qq-total-progress-bar"></div> 
     </div> 
     <div class="qq-upload-drop-area-selector qq-upload-drop-area" qq-hide-dropzone> 
      <span class="qq-upload-drop-area-text-selector"></span> 
     </div> 
     <div class="qq-upload-button-selector qq-upload-button"> 
      <div>Upload a file</div> 
     </div> 
     <span class="qq-drop-processing-selector qq-drop-processing"> 
     <span>Processing dropped files...</span> 
     <span class="qq-drop-processing-spinner-selector qq-drop-processing-spinner"></span> 
     </span> 
     <ul class="qq-upload-list-selector qq-upload-list" role="region" aria-live="polite" aria-relevant="additions removals"> 
      <li> 
       <span role="status" class="qq-upload-status-text-selector qq-upload-status-text"></span> 
       <div class="qq-progress-bar-container-selector qq-progress-bar-container"> 
        <div role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" class="qq-progress-bar-selector qq-progress-bar"></div> 
       </div> 
       <span class="qq-upload-spinner-selector qq-upload-spinner"></span> 
       <div class="qq-thumbnail-wrapper"> 
        <img class="qq-thumbnail-selector" id="imageID" qq-max-size="120" qq-server-scale> 
       </div> 
       <button type="button" class="qq-upload-cancel-selector qq-upload-cancel">X</button> 
       <button type="button" class="qq-upload-retry-selector qq-upload-retry"> 
       <span class="qq-btn qq-retry-icon" aria-label="Retry"></span> 
       Retry 
       </button> 
       <div class="qq-file-info"> 
        <div class="qq-file-name"> 
         <span class="qq-upload-file-selector qq-upload-file"></span> 
         <span class="qq-edit-filename-icon-selector qq-edit-filename-icon" aria-label="Edit filename"></span> 
        </div> 
        <input class="qq-edit-filename-selector qq-edit-filename" tabindex="0" type="text"> 
        <span class="qq-upload-size-selector qq-upload-size"></span> 
        <button type="button" class="qq-btn qq-upload-delete-selector qq-upload-delete"> 
        <span class="qq-btn qq-delete-icon" aria-label="Delete"></span> 
        </button> 
        <button type="button" class="qq-btn qq-upload-pause-selector qq-upload-pause"> 
        <span class="qq-btn qq-pause-icon" aria-label="Pause"></span> 
        </button> 
        <button type="button" class="qq-btn qq-upload-continue-selector qq-upload-continue"> 
        <span class="qq-btn qq-continue-icon" aria-label="Continue"></span> 
        </button> 
       </div> 
      </li> 
     </ul> 
     <dialog class="qq-alert-dialog-selector"> 
      <div class="qq-dialog-message-selector"></div> 
      <div class="qq-dialog-buttons"> 
       <button type="button" class="qq-cancel-button-selector">Close</button> 
      </div> 
     </dialog> 
     <dialog class="qq-confirm-dialog-selector"> 
      <div class="qq-dialog-message-selector"></div> 
      <div class="qq-dialog-buttons"> 
       <button type="button" class="qq-cancel-button-selector">No</button> 
       <button type="button" class="qq-ok-button-selector">Yes</button> 
      </div> 
     </dialog> 
     <dialog class="qq-prompt-dialog-selector"> 
      <div class="qq-dialog-message-selector"></div> 
      <input type="text"> 
      <div class="qq-dialog-buttons"> 
       <button type="button" class="qq-cancel-button-selector">Cancel</button> 
       <button type="button" class="qq-ok-button-selector">Ok</button> 
      </div> 
     </dialog> 
    </div> 

</script> 
<div id="fine-uploader-gallery"></div> 
$('#fine-uploader-gallery').fineUploader({ 
    template: 'qq-template-gallery', 
}); 
request: { 
     endpoint: 'upload_multiple_images' 
    }, 
    thumbnails: { 
     placeholders: { 
      waitingPath: '../assets/plugins/jquery.fine-uploader/placeholders/waiting-generic.png', 
      notAvailablePath: '../assets/plugins/jquery.fine-uploader/placeholders/not_available-generic.png' 
     } 
    }, 
    validation: { 
     allowedExtensions: ['jpeg', 'jpg', 'gif', 'png'] 
    } 
}); 

Пожалуйста, может кто-нибудь руководство мне, как получить идентификатор IMG, идентификатор = imgID каждый раз, когда он добавляется динамически. Заранее спасибо

+0

какой плагин вы используете? они могли бы зарегистрировать его – RRR

+0

Fine Uploader 5 –

ответ

2

Вы можете использовать обратные вызовы. Посмотрите на their documentation

var uploader = new qq.FineUploader({ 
    // options 
    callbacks: { 
     onUpload: function (id, name) { 
     }, 
     onSubmitted: function (id, name) { 
     } 
    } 
}); 
Смежные вопросы