上传图片

一 页面结构

       <input type="file" name="image"  value=" "  accept="image/*"  multiple />

        name : 设置保存图片的属性名

        value : 保存的图片

        multiple: 设置这个属性可以选择多个图片

二  js代码

        1  上传服务器代码        

        

         var formData = new FormData($('#sumbit-up')[0]);   //序列化表单
         //  var data =$('#sumbit-up').serialize();      //序列化数据，但不能序列化文件
         $.ajax({
                    type: 'post',
                    url: __domain__ + 'api/merge/singeapi/type/userComment', 
                    //    data:data,   
                    data: formData,
                    processData: false, 
                    contentType: false,
                    success: function(data) {
                               alert(JSON.stringify(data));
                     },
                     error: function(XMLHttpRequest, textStatus, errorThrown) {
                               alert("上传失败，请检查网络后重试");
                      }
                    });

 

         2 详细介绍

                 FormData和serialize   都是序列化表单，区别在与：后者只能序列化表单数据，比如select,比如文本框等input  select等的数据，

                 但是对于文件，比如文件上传，无法实现，那么这时候，FormData就上场了。

                 processData和contentType   缺少这二者的设置，将会出现  红色部分的错误提示，提交失败。