Js Image Upload encapsulation code and js Image Upload Encapsulation

Js Image Upload encapsulation code and js Image Upload Encapsulation

The examples in this article share the specific code for js Image Upload for your reference. The details are as follows:

Js Encapsulation Method

Function uploadImages (picker, url, callback) {var img_uploader = WebUploader. create ({auto: true, server: url, pick: picker, fileNumLimit: 1, fileSingleSizeLimit: 2097152, // 2 M accept: {title: 'images', extensions: 'gif, jpg, jpeg, bmp, png ', // mimeTypes: 'image/*'}, compress: {width: 300, compressSize: 102400 // <kb Not compressed},}) var fileType = ['image/jpeg ', 'image/jpg', 'image/gif ', 'image/png ', 'Image/bmp'] img_uploader.on ('beforefilequeued', function (file) {fileType. some (function (name) {return file. type == name })? '': Alert ('upload the correct picture! ')}) Img_uploader.on ('uploadsuccess', function (file, res) {callback (file, res)}) img_uploader.on ('uploaderror', function (file, reason) {console. log (reason) ;}) img_uploader.on ('uploadcomplete', function (file) {img_uploader.reset ()})}

Html

<Div id = "zTu"> image </div>

Javascript

Var coverImage; initImageUploader (); function initImageUploader () {var fileUrl = the address you want to upload; uploadImages ('# imagePicker', fileUrl, function (file, res) {coverImage = res. url $ ('# ztu '). get (0 ). innerHTML = '<div class = "file-item thumbnail">  </div> '})}

The above is all the content of this article. I hope it will be helpful for your learning and support for helping customers.