工作中用到的一個(gè)前端的插件webupload，由于頁(yè)面中有不確定數(shù)量的上傳圖片的按鈕。剛開(kāi)始我試著把這個(gè)插件封裝，結(jié)果……欲哭無(wú)淚呀，上傳不了，整個(gè)頁(yè)面的上傳按鈕都不好使。最后在文檔中，發(fā)現(xiàn)了addButton這個(gè)參數(shù)，終于解決了問(wèn)題。不說(shuō)了，直接上代碼

var uploader = WebUploader.create({// 選完文件后，是否自動(dòng)上傳。auto: true,// swf文件路徑swf: BASE_URL + 'assets/admin-tools/webuploader_fex/dist/Uploader.swf',// 文件接收服務(wù)端。server: 'url',duplicate : true,// 選擇文件的按鈕。可選。// 內(nèi)部根據(jù)當(dāng)前運(yùn)行是創(chuàng)建，可能是input元素，也可能是flash.pick: '#filePicker',fileVal: 'image', //服務(wù)端File對(duì)應(yīng)的名稱。// 只允許選擇圖片文件。accept: {title: 'Image',extensions: 'gif,jpg,jpeg,bmp,png',mimeTypes: 'image/*'}});// 文件上傳成功，給item添加成功class, 用樣式標(biāo)記上傳成功。uploader.on( 'uploadSuccess', function( file, obj ) {//如果你上傳成功需要對(duì)某一個(gè)文本框賦值 以$("#rt_"+file.source.ruid)為對(duì)象找到需要賦值的文本框$("#rt_"+file.source.ruid).parent().next().val(obj.name);成功執(zhí)行的代碼});// 文件上傳失敗，顯示上傳出錯(cuò)。uploader.on( 'uploadError', function( file ) {//失敗執(zhí)行的代碼});//計(jì)算出需要多少個(gè)實(shí)例化的按鈕var boxes_len = $(".class").length;//循環(huán)實(shí)例化頁(yè)面的上傳按鈕for(var i=1; i<=boxes_len ;i++){uploader.addButton({id : "#filePicker"+(i),//必須唯一innerHTML : '選擇圖片',});}

總結(jié)

以上是生活随笔為你收集整理的webupload 多个实例化上传按钮的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。