項目經理安排一個工作,讓寫一個文件上傳,要求可以上傳錄音和文本,非常簡單,寫完之后去客戶那里測試發現問題,客戶只有IE9,並且要求支持多選,沒辦法只能再繼續找其他的插件了,最后找到了webuploader這個插件。
說實話,這個插件功能很強大,就是有一個問題,api寫的太low了,好多內容api中都沒有,只能靠自己慢慢發現坑在慢慢填坑了。
1、點擊按鈕不會出現彈框。
按照api中的例子寫了一個簡單的上傳,但是發現怎么點擊都沒反應,百思不得其解啊,無意中發現了當按F12時就可以點擊了,但是不可能讓客戶每次都上傳都按下F12啊,然后在網上找到了這個問題的原因:WebUploader初始化的時候,封裝了一個input,type=‘file’。初始化的時候因為獲取不到正確的自身或者容器的大小,這時候初始化出來的這個透明層的大小就會是1px*1px,這么小的層,根本點不到。所以也就觸發不了點擊事件了,找到問題就好解決了,只需要在css里面加上一段代碼:
#filePicker_csv div:nth-child(2){ width:100%!important; height:100%!important; }
2、刪除多條等待數據中的某一條
我踩的坑是寫的點擊事件怎么都不起作用,解決方案是將該點擊事件加入到fileQueued事件中去,代碼如下:
$(".scList").on('click',function(){ var thisID = $(this).parent().parent().attr("id"); uploader_wav.removeFile(uploader_wav.getFile(thisID,true)); $(this).parent().parent().remove(); })
3、getFiles添加參數使用
uploader.getFiles() 這個方法獲取到的所有的文件,所以當執行第二問題的代碼時里面仍然有數據,那么這里就需要往括號里面添加參數了
- inited 初始狀態
- queued 已經進入隊列, 等待上傳
- progress 上傳中
- complete 上傳完成。
- error 上傳出錯,可重試
- interrupt 上傳中斷,可續傳。
- invalid 文件不合格,不能重試上傳。會自動從隊列中移除。
- cancelled 文件被移除
這就是我最近踩的坑了,以后碰到了再繼續補充吧