Ajax上传图片到服务器

Ajax上传图片到服务器

<tr>
    <th style="width: 70px;height:50px;">商品2<font color="red">*</font><br>(220*280)</th>
    <td style="width: 50px;text-align:left;height:50px;">
        <input id="upload_second" class="fileupload" name="upload" type="file" name="files[]"
               data-url="/category/uploadImg.action?width=190&height=100" multiple/>
        <script>
            $(function () {
                'use strict';
                // Change this to the location of your server-side upload handler:
                var url = '/banner/uploadImg.action';
                var dataType = 'json';
                if ($.NV('name') == "firefox" || $.NV('name') == "chrome") {
                    dataType = '';
                }
                $('#upload_second').fileupload({
                    dataType: dataType,
                    done: function (e, data) {
                        var json = data.result;
                        if (data.result.files == undefined || data.result.files == null) {
                            var jsonStr = data.result + "";
                            jsonStr = jsonStr.substring(0, jsonStr.length - 64);
                            json = $.parseJSON(jsonStr);
                        }
                        $.each(json.files, function (index, file) {
                            if (file.result == "true") {
                                var width = file.width;
                                var height = file.height;
                                if (width == 190 && height == 100) {
                                    $("#pti_second").attr("src", file.url);
                                    $("#skuImgTwo").val(file.url);
                                    //$("#picMsg").html("<font color='green'>(图片尺寸符合规格)</font>");
                                    alert("上传成功!");
                                } else {
                                    //$("#picMsg").html("<font color='red'>(您上传的图片尺寸不正确，请重新上传)</font>");
                                }


                            } else {
                                alert("上传失败:" + file.errorMsg + "!");
                            }

                        });
                    },
                    error: function (e, data) {
                        var json = data.result;
                        try {
                            if (data.result.files == undefined || data.result.files == null) {
                                var jsonStr = data.result + "";
                                jsonStr = jsonStr.substring(0, jsonStr.length - 64);
                                json = $.parseJSON(jsonStr);
                            }
                        } catch (err) {
                            json = e.responseText;
                            if (json == null || json == undefined) {
                                alert("上传失败.");
                                return;
                            }
                            json = json.substring(0, json.length - 64);
                            json = $.parseJSON(json);
                        }
                        $.each(json.files, function (index, file) {
                            if (file.result == "true") {
                                $("#pti_second").attr("src", file.url);
                                $("#skuImgTwo").val(file.url);
                                alert("上传成功!");
                            } else {
                                alert("上传失败:" + file.errorMsg + "!");
                            }
                        });
                    },
                    progressall: function (e, data) {
                        var progress = parseInt(data.loaded / data.total * 100, 10);
                    }
                }).prop('disabled', !$.support.fileInput)
                        .parent().addClass($.support.fileInput ? undefined : 'disabled');
            });
        </script>

        <dd><img id="pti_second" src="$!{bannerApp.skuImgTwo}" width="400px" height="300px" title=""/><span
                id="picMsg"></span></dd>
        <input type="hidden" id="skuImgTwo" name="skuImgTwo" value="$!{bannerApp.skuImgTwo}"/>
        <input type="hidden" id="skuIdTwo" name="skuIdTwo" value="$!{bannerApp.skuIdTwo}"/>
    </td>

</tr>