《jquery photoClip支持手機(jī)端裁剪的本地裁剪圖片后上傳插件》要點(diǎn)：
本文介紹了jquery photoClip支持手機(jī)端裁剪的本地裁剪圖片后上傳插件，希望對(duì)您有用。如果有疑問，可以聯(lián)系我們。
相關(guān)主題：HTML和JS入門 / JS、Jquery插件
圖片上傳前裁剪，現(xiàn)有好幾款插件，不過支持手機(jī)，PC最好的是jquery photoClip插件。
這個(gè)插件外面流傳至少2個(gè)版本，其中一個(gè)是不支持調(diào)整寬高，固定正方形。這款從這里下載：
https://github.com/baijunjie/PhotoClip.js
這里推薦這款：https://github.com/topoadmin/photoClip 可以調(diào)整寬高，
注意，示例中用到了amazeui.min.js插件，這個(gè)是非必須的，它是一個(gè)框架JS，在使用時(shí)不要只會(huì)抄。增加了頁(yè)面大小。
下面是API摘要，具體見：https://github.com/topoadmin/photoClip/blob/master/docs/api.md
| 選項(xiàng) | 類型 | 默認(rèn)值 | 描述 |
|---|---|---|---|
| width | Int | 200 | 裁剪框?qū)?/span> |
| height | Int | 200 | 裁剪框高 |
| fileMinSize | Int | 20 | 圖片質(zhì)量最小值(kb) |
| defaultImg | String | '圖片路徑' | 初始圖片路徑（未完善） |
| file | dom | null | (必須) file按鈕 |
| ok | dom | null | (必須) 確定裁剪按鈕 |
| outputType | String | 'jpg' | 指定輸出圖片的類型，可選 "jpg" 和 "png" 兩種種類型，默認(rèn)為 "jpg" |
| strictSize | Boolean | false | 是否嚴(yán)格按照截取區(qū)域?qū)捀卟眉?/strong>。默認(rèn)為false，表示截取區(qū)域?qū)捀邇H用于約束寬高比例。如果設(shè)置為true，則表示截取出的圖像寬高嚴(yán)格按照截取區(qū)域?qū)捀咻敵觥?/td> |
| customOutput | Boolean | false | 自定義選擇完畢輸出，不執(zhí)行內(nèi)部填充函數(shù) |
| loadStart | Function | null | 開始加載的回調(diào)函數(shù)。this指向 fileReader 對(duì)象，并將正在加載的 file 對(duì)象作為參數(shù)傳入。 |
| loadProgress | Function | null | 加載中的回調(diào),傳入?yún)?shù) 加載百分比 |
| loadComplete | Function | null | 加載完成的回調(diào)函數(shù)。this指向圖片對(duì)象，并將圖片地址作為參數(shù)傳入。 |
| loadError | Function | null | 加載失敗的回調(diào)函數(shù)。this指向 fileReader 對(duì)象，并將錯(cuò)誤事件的 event 對(duì)象作為參數(shù)傳入。 |
| clipFinish | Function | null | 裁剪完成的回調(diào)函數(shù)。this指向圖片對(duì)象，會(huì)將裁剪出的圖像數(shù)據(jù)DataURL作為參數(shù)傳入。 |
| formatError | Function | null | 圖片格式錯(cuò)誤 |
| imgSizeMin | Function | null | 圖片質(zhì)量小于設(shè)置范圍時(shí)回調(diào) |
可以回調(diào)函數(shù)clipFinish用于接收裁剪完后，用$.post上傳到服務(wù)器保存。
轉(zhuǎn)載請(qǐng)注明本頁(yè)網(wǎng)址：
http://www.fzlkiss.com/jiaocheng/70.html
