微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

js图片上传的封装代码

本文实例为大家分享了js图片上传的具体代码,供大家参考,具体内容如下

js封装的方法

rush:js;"> function uploadImages(picker,url,callback) { var img_uploader = WebUploader.create({ auto: true,server: url,pick: picker,fileNumLimit: 1,fileSingleSizeLimit: 2097152,// 2M accept: { title: 'Images',extensions: 'gif,jpg,jpeg,bmp,png',// mimeTypes: 'image/*' },compress: { width: 300,compressSize: 102400 // < 100kb 不压缩 },})

var fileType = ['image/jpeg','image/jpg','image/gif','image/png','image/bmp']

img_uploader.on('beforeFileQueued',function(file) {

fileType<a href="https://www.jb51.cc/tag/so/" target="_blank" class="keywords">.so</a>me(function(name) {
  return file.type === name
})

? '' : alert('请<a href="https://www.jb51.cc/tag/shangchuan/" target="_blank" class="keywords">上传</a>正确的<a href="https://www.jb51.cc/tag/tupian/" target="_blank" class="keywords">图片</a>!')

})

img_uploader.on('uploadSuccess',function(file,res) {
callback(file,res)
})

img_uploader.on('uploadError',reason) {
console.log(reason);
})

img_uploader.on('uploadComplete',function(file) {
img_uploader.reset()
})

}

html

rush:xhtml;">
图片

javascript

rush:js;"> var coverImage; initimageUploader(); function initimageUploader(){ var fileUrl = 你想上传的地址; uploadImages('#imagePicker',fileUrl,res) { coverImage = res.url $('#zTu').get(0).innerHTML = '
' }) }

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程之家。

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐