webuploader在ie7下不能使用h5模式上傳圖片,只能使用flash模式。
但是出現(xiàn)了幾個(gè)問(wèn)題:(1)必須正確的引入.swf文件,才能使webuploader正常運(yùn)行
(2)正常傳輸模式下,flash模式使用的md5不能上傳太大的文件,(好像只能上傳50k左右),所以要改成二進(jìn)制流sendAsBinary
的模式上傳
(3)二進(jìn)制上傳的使用file_get_contents(‘PHP://input’)獲取上傳內(nèi)容(自己百度)
代碼:html
<div class="descriptPic" style="color:red;margin:0 -100px 4px;"> <label id="contactpic" style="width:100px;color:#727272;">問(wèn)題截圖:</label> <!-- <input type="file" name="descriptPic[]" value="選擇圖片"/> --> <div id="uploader" class="uploader" style="width: 400px;float:left;margin-bottom: 15px;"> <div class="queueList"> <div class="webuploader-container" id="filePicker" style=" width: 150px;"> <div style="position: absolute;top: 0;left: 0;width: 150px;height: 45px;overflow: hidden;bottom: auto;right: auto;" id="rt_rt_1aec5bmr5qg9m5o1eat1pahqe1"> <input accept="image/*" multiple="multiple" class="webuploader-element-invisible" name="file" type="file" style="margin-left:0;margin-right:0;width:150px;height:40px;"/> <label style="opacity: 0; width: 100%; height: 100%; display: block; cursor: pointer; background: rgb(255, 255, 255) none repeat scroll 0% 0%;"> </label> </div> </div> <ul class="filelist"></ul> </div> <div class="statusBar"> <div class="progress" style="display: none;"> <span class="text">0%</span> <span class="percentage" style="width: 0%;"></span> </div><div class="info" style="color: #5A5A5A;font-size: 15px ">共0張(0B),已上傳0張</div> <div class="btns"> </div> <div class="uploadBtn state-ready" id="uploadBtn" onclick="check_upload_type()" style="CURSOR:pointer;width: 390px;margin-top: 5px;">提交</div> </div> </div></div>js:
<script type="text/javascript"> // 添加全局站點(diǎn)信息 var BASE_URL = '{$smarty.const.THEME_URL}'; //alert(BASE_URL);</script><script type="text/javascript" src="js/webuploader.js"></script><script type="text/javascript"> var upload_type=1; var p_name=document.getElementById('p_name'); p_name.value = new Date().getTime(); var $ = jQuery, $list = $('#fileList'), $wrap = $('#uploader'), // 圖片容器 $queue = $('<ul class="filelist"></ul>') .appendTo( $wrap.find('.queueList') ), // 狀態(tài)欄,包括進(jìn)度和控制按鈕 $statusBar = $wrap.find('.statusBar'), // 文件總體選擇信息。 $info = $statusBar.find('.info'), // 上傳按鈕 $upload = $wrap.find('.uploadBtn'), // 沒選擇文件之前的內(nèi)容。 $placeHolder = $wrap.find('.placeholder'), // 總體進(jìn)度條 $progress = $statusBar.find('.progress').hide(), // 添加的文件數(shù)量 fileCount = 0, // 添加的文件總大小 fileSize = 0, // 優(yōu)化retina, 在retina下這個(gè)值是2 ratio = window.devicePixelRatio || 1, // 縮略圖大小 thumbnailWidth = 110 * ratio, thumbnailHeight = 110 * ratio, // 可能有pedding, ready, uploading, confirm, done. state = 'pedding', // 所有文件的進(jìn)度信息,key為file id percentages = {}, supportTransition = (function(){ var s = document.createElement('p').style, r = 'transition' in s || 'WebkitTransition' in s || 'MozTransition' in s || 'msTransition' in s || 'OTransition' in s; s = null; return r; })(), // WebUploader實(shí)例 uploader; if ( !WebUploader.Uploader.support() ) { alert( 'Web Uploader 不支持您的瀏覽器!如果你使用的是IE瀏覽器,請(qǐng)嘗試升級(jí) flash 播放器'); throw new Error( 'WebUploader does not support the browser you are using.' ); } // 初始化Web Uploader uploader = WebUploader.create({ runtimeOrder:'flash', pick: { id: '#filePicker', innerHTML: '點(diǎn)擊選擇圖片' }, fileNumLimit:6, //auto: true, method:'post', accept: { title: 'Images', extensions: 'gif,jpg,jpeg,bmp,png', mimeTypes: 'image/*' }, // swf文件路徑 swf:BASE_URL+ 'Public/images/Uploader.swf', //disableGlobalDnd: true, sendAsBinary:true, chunked: true, server: '{url m="FeedBack" a="imageupload"}', fileSizeLimit: 5 * 1024 * 1024, // 200 M fileSingleSizeLimit: 1 * 1024 * 1024 // 50 M });
其它引入的文件跟webuploader實(shí)例一樣。因?yàn)槭褂昧丝蚣埽钥赡苡悬c(diǎn)亂
聯(lián)系客服