jQuery仿淘宝图片上传预览

查看演示立即下载

插件描述：jQuery仿淘宝图片上传预览,支持拖拽上传

使用方法

1、引入js文件

1 2	`<script` `src="/"></script>` `<script` `src="js/upload.js"></script>`

2、插件区域

<div class="drop">
    <div id="drop_area"></div>
    <div id="drop_area2"></div>
    <div id="drop_area3"></div>
    <div id="drop_area4"></div>
</div>

3、绑定元素

var dragImgUpload = new DragImgUpload("#drop_area",true,{
    callback:function (files) {
        //回调函数，可以传递给后台等等
        var file = files[0];
        console.log(file.name);
    }
})

4、图片上传方法

createImageUploadDialog:function () {
        var fileInput = this.fileInput;
        if (!fileInput) {
            //创建临时input元素
            fileInput = document.createElement('input');
            //设置input type为文件类型
            fileInput.type = 'file';
            //设置文件name
            fileInput.name = 'ime-images';
            //允许上传多个文件
            fileInput.multiple = true;
            fileInput.onchange  = this.onChangeUploadFile.bind(this);
            this.fileInput = fileInput;
        }
        //触发点击input点击事件，弹出选择文件对话框
        fileInput.click();
}

特别申明：
本站所有资源都是由网友投稿发布，或转载各大下载站，请自行检测软件的完整性！
本站所有资源仅供学习与参考，请勿用于商业用途，否则产生的一切后果将由您自己承担！
如有侵权请联系我们删除下架，联系方式：lei1294551502@163.com

上一个特效： js CPS在线测试
下一个特效：原生Javascript的消息提示插件DreamMsg(原创)