jQuery圖片拖動組件Dropzone用法示例
本文實例講述了jQuery圖片拖動組件Dropzone用法。分享給大家供大家參考,具體如下:
dropzone 主要功能:支持拖動圖片上傳,提供圖片預(yù)覽,等功能 參考地址:http://www.dropzonejs.com
1. 安裝 npm install dropzone ,會下載一個dropzone
2. dropzone文件夾dist 下有兩個文件一個dropzone.js 一個dropzone.css 將這兩個文件添加到頁面上
3. 初始化Dropzone ,demo代碼如下
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> <script src="jquery.min.js"></script> <script src="dropzone.min.js"></script> <link rel="stylesheet" href="dropzone.css"> </head> <body> <div id="dropz" class="dropzone"></div> <script> $(function () { $("#dropz").dropzone({ url: "fileUpload.htm", maxFiles: 10, maxFilesize: 512, acceptedFiles: ".jpg" }); }) </script> </body> </html>
更多關(guān)于jQuery相關(guān)內(nèi)容感興趣的讀者可查看本站專題:《jQuery常用插件及用法總結(jié)》、《jQuery擴展技巧總結(jié)》、《jQuery切換特效與技巧總結(jié)》、《jQuery遍歷算法與技巧總結(jié)》、《jQuery常見經(jīng)典特效匯總》及《jquery選擇器用法總結(jié)》
希望本文所述對大家jQuery程序設(shè)計有所幫助。
相關(guān)文章
jQuery實現(xiàn)自動輸入email、時間和域名的方法
這篇文章主要介紹了jQuery實現(xiàn)自動輸入email、時間和域名的方法,涉及jQuery表單操作的相關(guān)技巧,需要的朋友可以參考下2016-08-08有關(guān)jQuery中parent()和siblings()的小問題
本文通過一個實例給大家介紹有關(guān)parent()和siblings()問題原因及解決方案,非常不錯具有參考借鑒價值,感興趣的朋友一起看看吧2016-06-06jQuery配合coin-slider插件制作幻燈片效果的流程解析
coin-slider是GitHub上的一個人氣JavaScript開源插件,用它來實現(xiàn)幻燈片效果只需要動手寫很少的代碼,下面我們就來看一下jQuery配合coin-slider插件制作幻燈片效果的流程解析.2016-05-05jQuery實現(xiàn)復(fù)選框全選/取消全選/反選及獲得選擇的值
這篇文章主要介紹了jQuery實現(xiàn)的復(fù)選框全選/取消全選/反選及獲得選擇的值,需要的朋友可以參考下2014-06-06