Jquery之图片上传

HTML:

<a id="upload">图片上传</a>
<img src="" style="width:50px;height:50px;display:none;" id="imgView"/>
<input type="file" name="uploadFile" id="uploadFile" style="display:none;">

Jquery:

$('#upload').click(function() {
    $('#uploadFile').click();
});    
$('#uploadFile').change(function(){
    var data = new FormData();
    $.each($('#uploadFile')[0].files, function(i, file) {
        data.append('upfile', file);
    });
    $.ajax({
        url:'upload.php',
        type:'POST',
        data:data,
        cache: false,
        dataType: "json",
        contentType: false,        //不可缺参数
        processData: false,        //不可缺参数
        success:function(data){
            if (data.state == 'SUCCESS')
            {
                $('#imgView').attr('src',data.url).show();
            } else {
                alert(data.error);
            }
        },
    });
});

 

你可能感兴趣的:(Jquery之图片上传)