1.input提交圖片實時展示
<img src="/static/img/default.png" width="80" height="80" style="margin-left: 20px" id="id_img"> <input type="file" name="file" id="id_file"> <script> //當該控件發生變化，響應該事件 $("#id_file").change(function () { //alert(1) //取到文件對象 var file = $("#id_file")[0].files[0] //放到img控件上，借助於filereader 中間的東西，文件閱讀器 //生成一個文件閱讀器對象賦值給filereader var filereader = new FileReader() //把文件讀到filereader對象中 //讀文件需要時間，需要文件讀完再去操作img //如果沒這一步操作下面不一定變化 filereader.readAsDataURL(file) filereader.onload = function () { $("#id_img").attr('src', filereader.result) } }) </script>2.對於后台傳輸與接收
1.傳輸
<script>
xxxxxxxxxx #就是就是觸發傳圖片的時間,下面核心的aja**- $.ajax({ url: '/register/', type: 'post', data: {'img':$("#id_file")[0].files[0]}, success: function (data){ } }) </script>2.接收
#核心代碼 img=request.FILES.get('img') #如果設置中沒有設置默認存儲在avatar文件下 #對於存儲位置設置需要在setting中設置 #加這兩句，以后再上傳的圖片，都放在media文件夾下 MEDIA_URL = "/media/" MEDIA_ROOT = os.path.join(BASE_DIR, "media")3.路由
#開路由,直接通過URL能訪問源碼 from django.views,static import serve from django.conf import settings #要載入他的配置文件 urlpatterns = [ url(r'^media/(?P<path>.*)',serve,{'document_root':'文件的根路徑'}), ] #他會進行拼接,根據傳的path拼接再文件的根路徑后,然后找到文件
來源：小小咸魚YwY