H5 jquery FormData 图片上传

不积跬步，无以至千里；不积小流，无以成江海

由于工作原因，最近在写web页面，移动端和web有共通之处，总结遇到的坑，新手坑！

问题1：项目中使用JSONP的方式实现跨域，我在实现图片上传的接口中添加JSONP出问题，接口请求出错。
解决：其实JSONP只能是"GET"请求方式，使用post方式上传图片，就会报错，删除

 $.ajax({
            url: url,
            dataType: "JSONP",
            type: "POST",
            data: data,

中的dataType: "JSONP"就好了

问题2：编写form表单时，没有添加 enctype="multipart/form-data" 造成不能上传
解决：后台提供的是form-data的上传方式，没有填写"multipart/form-data"就是造成不识别，报错。

下面是完整代码：

<form name="form1" id="form1" enctype="multipart/form-data">
    <p>photo:<input type="file" name="coverUrl" id="photo"></p>
    <p><input type="button" name="b1" value="submit" onclick="uploadAvatar()" style="border: #393F4D solid 0.05rem"></p>
</form>
function uploadAvatar() {
        var url = "http://testlan.yuanxingtech.com:8080/yxvcity-admin-vc" + "/rest/partnerPlanningSchemeInfo/publishOrSaveSchemeInfo";
        var citizenId = "92eb1d963102481b8013a45892e00511";

        var data = new FormData();
        data.append('coverUrl', $('#photo')[0].files[0]);
        data.append("phone", '');
        data.append("name", '尸王争霸');

        $.ajax({
            url: url,
            type: "POST",
            data: data,
            // async : false,
            cache : false,
            contentType : false,// 告诉jQuery不要去设置Content-Type请求头  
            processData : false,// 告诉jQuery不要去处理发送的数据  

            success: function (res) {
                console.log(res);
            },
            error: function (err) {
                console.log(err);
            }
        });
        console.log("上传头像。。。");
    }

跑得慢，听到的是骂声； 跑得快，听到的就只是风声