立即上傳圖片

在我的last question，沒有人能給我任何正確的解決方案。所以我感謝另一個上傳圖片的過程。立即上傳圖片

現在我想通過輸入類型文件選擇後立即上傳圖像。

如何通過此腳本來完成。

HTML：（這裏888是由PHP動態ID）

<form class="upload_Reply" id="888'" method="post" enctype="multipart/form-data"> 
<label for="file">Filename (Max 200 Kb) :</label> 
<input type="file" name="file" class="repfile" id="888" value="" /> 
</form>

腳本：

$(document).on('change','.repfile',function(){ 
    previewPic(this); 
}); 

function previewPic(input) { 
    if (input.files && input.files[0]) { 
     var reader = new FileReader(); 
     reader.onload = function (e) { 
      $("#preview_rep"+ input.id).attr('src', e.target.result); 
      $("#output_rep"+ input.id).show(); 
      var str = e.target.result; 
      var ID = input.id; 
      UploadFile(str, ID); 
     }; 
     reader.readAsDataURL(input.files[0]); 
    } 
} 
function UploadFile(str, ID) { 
    str = ??? 
    var EID = ID; 
    $('.loading').show(); 
    $.ajax({ 
      type:"post", 
      url:"../upload.php", 
      data: new FormData(this), 
      contentType: false, 
      cache: false, 
      processData:false, 
      success: function(response){ 
       $('#img'+ EID).attr('value', response); 
       $('.loading').hide(); 
     }, 
    }); 
    return false; 
}

來源

2015-08-19 koc

你得到什麼錯誤？ –

沒有文件上傳。謝謝 – koc

好，如果沒有文件上傳有兩個原因之一，你有你的PHP其他錯誤你的數據是錯誤的，而上傳文件，數據錯誤可以通過使用適當的數據或正確的數據發送到PHP解決...... ...看到我的回答:) –

我會建議你使用jQuery的第三方可靠穩定的插件，而不是自己的自定義代碼

與插件，您可以

顯示文件的進度上傳，如果正確的文件被選中
預覽圖像
變化預覽
，還有更多的選擇
驗證

一些最好的插件和易於使用的插件是

uploadify -
blue imp file upload

我自己用的uploadify，它爲我做了所有的工作。

$(document).ready(function(){ 
     $('#repfile').uploadify({ 
     'uploader' : '/uploadify/uploadify.swf', 
     'script' : '/uploadify/uploadify.php', 
     'cancelImg' : '/uploadify/cancel.png', 
     'folder' : '/uploads', 
     'auto'  : true 
     }); 
});

希望我的回答是有幫助的

比你可以點擊這裏查看其它 - upload files with ajax

來源

2015-08-19 13:59:06

立即上傳圖片

回答

相關問題