2012-01-06 4 views
0

Я новичок в JQuery, и я бы сказал, что ничего не знаю в этом. Я хотел разработать небольшой загрузчик изображений с участием AJAX. Я получил этот кусок кода от google, и я получил его работу. Теперь я должен использовать произвольное имя изображения при загрузке файла. Код, который у меня есть, - это загрузка с именем файла самого изображения. Я действительно не знаю, где искать, чтобы изменить концепцию именования файлов. Поэтому я решил проследить, откуда он начинается. Можете ли вы, ребята, помочь мне сузить вопрос? Поэтому я также изучу JQuery. Вот код.JQuery - Как работает следующий код?

$(function(){ 
    $('#swfupload-control').swfupload({ 
     upload_url: "upload-file.php?p_id=<?php echo $prod_id; ?>", 
     file_post_name: 'uploadfile', 
     file_size_limit : "1024", 
     file_types : "*.jpg;*.png;*.gif", 
     file_types_description : "Image files", 
     file_upload_limit : 5, 
     flash_url : "js/swfupload/swfupload.swf", 
     button_image_url : 'js/swfupload/wdp_buttons_upload_114x29.png', 
     button_width : 114, 
     button_height : 29, 
     button_placeholder : $('#button')[0], 
     debug: false 
    }) 
    .bind('fileQueued', function(event, file){ 
     //alert(file.name); 
     var listitem='<tr class="r1" id="'+file.id+'" >'+ 
      '<td>&nbsp;</td>'+ 
      '<td><span class="filename"><em>'+file.name+'</em> ('+Math.round(file.size/1024)+' KB) </span>'+ 
      '<span class="progressvalue" ></span>'+ 
      '<div class="progressbar" ><div class="progress" ></div></div>'+ 
      '<p class="status" >Pending</p></td>'+ 
      '<td>&nbsp;</td>'+ 
      '<td><span class="cancel" >&nbsp;</span></td>'+ 
      '</tr>'; 
     $('#log').append(listitem); 
     $('tr#'+file.id+' .cancel').bind('click', function(){ 
      var swfu = $.swfupload.getInstance('#swfupload-control'); 
      swfu.cancelUpload(file.id); 
      $('tr#'+file.id).slideUp('fast'); 
     }); 
     // start the upload since it's queued 
     //alert(this.getAttribute("id")) 
     $(this).swfupload('startUpload'); 
    }) 
    .bind('fileQueueError', function(event, file, errorCode, message){ 
     alert('Size of the file '+file.name+' is greater than limit'); 
    }) 
    .bind('fileDialogComplete', function(event, numFilesSelected, numFilesQueued){ 
     $('#queuestatus').text('Files Selected: '+numFilesSelected+'/Queued Files: '+numFilesQueued); 
    }) 
    .bind('uploadStart', function(event, file){ 
     $('#log tr#'+file.id).find('p.status').text('Uploading...'); 
     $('#log tr#'+file.id).find('span.progressvalue').text('0%'); 
     $('#log tr#'+file.id).find('span.cancel').hide(); 
    }) 
    .bind('uploadSuccess', function(event, file, serverData){ 
     var item=$('#log tr#'+file.id); 
     var content = '<td><img src="images/ProductImages/'+file.name+'" width="50" height="50"/><td/>' 
      +'<td>'+file.name+'</td> <td style="text-align: center;">' 
      +'<input type="checkbox" value="'+file.name+'" name="main" onClick="update_chk(this.value);"/></td>' 
      +'<td>Delete</td>'; 
     item.html(content); 

    }) 
    .bind('uploadProgress', function(event, file, bytesLoaded){ 
     //Show Progress 
     var percentage=Math.round((bytesLoaded/file.size)*100); 
     $('#log tr#'+file.id).find('div.progress').css('width', percentage+'%'); 
     $('#log tr#'+file.id).find('span.progressvalue').text(percentage+'%'); 
    }) 

    .bind('uploadComplete', function(event, file){ 
     // upload has completed, try the next one in the queue 
     $(this).swfupload('startUpload'); 
    }) 

}); 
function update_chk(value){ 
    document.getElementById("main_name").value = value; 
} 
+1

Вы не должны быть просто изменив имя файла на случайную на вашем сценарии на стороне сервера? Это было бы проще всего сделать. – JohnP

+0

@JohnP: Да, я делаю это, но когда загрузчик перечисляет статус загрузки, я загружаю миниатюру изображения, которое я только что загрузил, если я использовал случайное имя для изображения, которое клиентская сторона не знает о случайное имя. Как уведомить клиентскую сторону об изменении случайного имени? – Deepak

+0

зависит от того, как вы это делаете. Вы можете отправить статус, прежде чем начать загрузку. Возможно, сделать это двухэтапным процессом. В любом случае, почему вы используете информацию с сервера, чтобы показывать эскиз и прогресс? Насколько мне известно, это должно быть от клиента. – JohnP

ответ

2

Что такое серверная технология, используемая для загрузки файлов, PHP, Java? На стороне сервера вы можете сгенерировать случайную строку и использовать ее как имя файла, а не по умолчанию.

Например, в PHP можно было бы сделать:

// Where the file is going to be placed 
$target_path = 'uploaded_files/'; 

/* Add the original filename to our target path. 
Result is "uploaded_files/filename.extension" */ 
$target_path = $target_path . basename(md5($_FILES['file']['name'])); 

if(move_uploaded_file($_FILES['file']['tmp_name'], $target_path)) { 
    echo "The file ". basename($_FILES['file']['name']). 
    " has been uploaded"; 
} else{ 
    echo "There was an error uploading the file, please try again!"; 
} 
+0

проверить мой ответ комментарий на мой вопрос .. – Deepak

Смежные вопросы