查看: 389|回复: 0

[JavaScript/JQuery] jQuery图片拖动组件Dropzone用法示例

发表于 2017-7-16 09:30:41

本文实例讲述了jQuery图片拖动组件Dropzone用法。分享给大家供大家参考,具体如下:

dropzone 主要功能:支持拖动图片上传,提供图片预览,等功能 参考地址:

1. 安装 npm install dropzone ,会下载一个dropzone

2. dropzone文件夹dist 下有两个文件一个dropzone.js 一个dropzone.css 将这两个文件添加到页面上

3. 初始化Dropzone ,demo代码如下

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title></title>
  6. <script src="jquery.min.js"></script>
  7. <script src="dropzone.min.js"></script>
  8. <link rel="stylesheet" href="dropzone.css">
  9. </head>
  10. <body>
  11. <div id="dropz" class="dropzone"></div>
  12. <script>
  13. $(function () {
  14. $("#dropz").dropzone({
  15. url: "fileUpload.htm",
  16. maxFiles: 10,
  17. maxFilesize: 512,
  18. acceptedFiles: ".jpg"
  19. });
  20. })
  21. </script>
  22. </body>
  23. </html>
复制代码

更多关于jQuery相关内容感兴趣的读者可查看本站专题:《jQuery常用插件及用法总结》、《jQuery扩展技巧总结》、《jQuery切换特效与技巧总结》、《jQuery遍历算法与技巧总结》、《jQuery常见经典特效汇总》及《jquery选择器用法总结》

希望本文所述对大家jQuery程序设计有所帮助。



回复

使用道具 举报