最终效果展示

xhr发起请求

                 Document                                 
                        0%                                img {            width: 50px;            height: 50px;            display: none;        }                 
                $(function() {            $(document).ajaxStart(function() {                $('#loading').show()            })            $(document).ajaxStop(function() {                $('#loading').hide()            })            $('#btnupload').on('click', function() {                var files = $('#file1')[0].files                if (files.length <= 0) {                    alert('请选择文件')                }                console.log('ok');                var fd = new FormData()                fd.append('avatar', files[0])                $.ajax({                    method: 'POST',                    url: 'http://www.liulongbin.top:3006/api/upload/avatar',                    data: fd,                    processData: false,                    contentType: false,                    success: function(res) {                        console.log(res);                    }                })             })         })

到此这篇关于Ajax实现上传图像功能的示例详解的文章就介绍到这了,更多相关Ajax上传图像内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！