使用ajax异步上传图片

html代码:

<input type="file" id="file3" class="file" width="100%" height="100%" onchange="upFile(this);">

js代码:

function upFile(elem) {
    var form = new FormData();
    if(elem.files.length == 0)
        return;
    var fileimg = elem.files[0];
    form.append("file", fileimg);

    $('.waitmask').attr('style', 'display: block;');

    $.ajax({
        url: '?r=upimg/index',
        type: 'post',
        dataType: 'json',
        data: form,
        //Options to tell JQuery not to process data or worry about content-type
        cache: false,
        contentType: false,
        processData: false,
        success: function (respData) {
            if(respData.code != 200)
            {
                alert(respData.message);
                $("#" + elem.id + "m").attr("src", '');
                return;
            }
            $("#" + elem.id + "m").attr("src", respData.data.url);
            $("#" + elem.id + "mi").attr("value", respData.data.url);
            $('.waitmask').attr('style', 'display: none;');
        },
        error: function () {
            alert("链接服务器失败");
            $("#" + elem.id + "m").attr("src", '');
        }
    });
}

分类: 前端

发表评论

电子邮件地址不会被公开。 必填项已用*标注