先介紹一下這款插件,而後再談使用中可能遇到的問題javascript
ssi-uploader是一個JQuery的圖片上傳插件,界面比較美觀html
github地址:https://github.com/ssbeefeater/ssi-uploaderjava
演示地址:http://ssbeefeater.github.io/#ssi-uploader/examplesgit
使用文檔:http://ssbeefeater.github.io/#ssi-uploader/documentationgithub
這裏就不說明怎麼使用了,github上面提供有,官網文檔上面也有服務器
本博文主要說兩個問題,也是我使用時碰到的,後續碰到問題在來補充編輯器
一、中文顯示問題(雖然官方說支持中文,但在js文件源碼中並無寫這塊兒的代碼)ui
二、當點擊選擇文件時,自動提交表單<form>的action地址this
問題1解決辦法:url
使用文本編輯器(或任何一款代碼編輯器)打開ssi-uploader.js文件,滑動至文檔幾行最後,會看到只有en英文,和希臘文,
在locale添加以下代碼,注意添加逗號。
,
zh_CN: { success: '成功', sucUpload: '上傳成功', chooseFiles: '選擇文件', uploadFailed: '上傳失敗', serverError: '服務器內部錯誤', error: '錯誤', abort: '終止', aborted: '已經終止', files: '文件', upload: '上傳', clear: '清空', drag: '將文件拖放到這裏', sizeError: '文件$1,超過限制大小$2',// $1=file name ,$2=max ie( example.jpg has has exceed the size limit of 2mb) extError: '不支持$1類型的文件',//$1=file extension ie(exe files are not supported) someErrorsOccurred: '發生了一些錯誤' }
而後在使用時這樣便可,注意第五行
$('#ssi-upload').ssi_uploader({ url: '#', preview: false, maxNumberOfFiles: 1, locale: "zh_CN", allowed: ['jpg', 'gif', 'txt', 'png', 'pdf'] });
問題2解決辦法:
根本緣由我沒有找到,不過我找到一種方法能夠解決
首先在html文檔中,給input添加屬性data-validate="required:" ,即不可無值
<input data-validate="required:" type="file" multiple id="ssi-upload" />
而後修改ssi-uploader.js文件的67行,將
$input.on('change', function () { //choose files
thisS.toUploadFiles(this.files);
$input.val('');
});
改成
$input.on('change', function () { //choose files
thisS.toUploadFiles(this.files);
$input.val('a');
});
網上這個問題信息比較少,因此但願對你們有幫助,後續遇到問題還會補充
轉載請註明地址謝謝:http://www.cnblogs.com/wu-yun-jiang/p/6289206.html