JQuery - 下面的代碼如何工作？

Question

我是JQuery的新手，我會說我對此一無所知。我想開發一個涉及AJAX的小圖片上傳器。我從谷歌那裏得到了這段代碼，並得到了它的工作。現在我必須在上傳文件時使用隨機圖像名稱。我有的代碼是上傳與圖像本身的文件名。我真的不知道要在哪裏改變文件命名的概念。所以我決定從它開始的地方追蹤。你們能幫我縮小這個問題嗎？所以我也會學習一些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; 
} 

Answer 1

什麼是您用於fileupload，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!"; 
}