>[danger] ##### html * 這里注意 要隱藏iframe ~~~ <iframe id="iframe" name="iframe"></iframe> <form id="fm1" enctype="multipart/form-data" method="post" action="/ajaxload/" target="iframe"> <input id="load" type="file" name="k3"> </form> <div id="preview"> </div> ~~~ >[danger] ##### js * 注意幾個問題，第一個問題是用change 或者是onchange綁定input，需要改變input的類型，連接地址要加\.由于本身是分割符號，所以雙\\ ~~~ $(function () { imgfile(); }) function imgfile() { $('#load').change(function () { document.getElementById('iframe').onload = reloadIframl document.getElementById('fm1').submit() }) } function reloadIframl() { var concent = this.contentWindow.document.body.innerHTML; var obj = JSON.parse(concent); if(obj.status){ var img = document.createElement('img') img.src ="\\"+ obj.data $('#preview').empty().append(img); } } ~~~ >[danger] ##### 后臺 * 要注意。文件的屬性 都在request.FILES.get('k3') ~~~ def ajaxload(request): if request.method == "GET": return render(request,"img.html") if request.method == "POST": ret = {'status':True,'data':None,'message':None} import os import json print(request.FILES) obj =request.FILES.get('k3') file_path = os.path.join('static', obj.name) f = open(file_path,"wb") for i in obj.chunks(): f.write(i) f.close() ret['data'] = file_path return HttpResponse(json.dumps(ret)) ~~~