圖片上傳插件jquery.uploadify詳解
更新時間：2013年11月15日 09:36:41 作者：
如果頁面沒有顯示“BROWSE”按鈕，則說明你的'uploader' : '<%=basePath%>images/uploadify.swf'配置不對，檢查下路徑是否正確
1、js代碼：
復(fù)制代碼 代碼如下:
<script type="text/javascript">
$(document).ready(function() {
$('#fileInput').uploadify({
//以下參數(shù)均是可選
'uploader' : '<%=basePath%>images/uploadify.swf', //指定上傳控件的主體文件，默認(rèn)‘uploader.swf'
'script' : '<%=basePath%>UploadServlet', //指定服務(wù)器端上傳處理文件，默認(rèn)‘upload.php'
'cancelImg' : '<%=basePath%>images/cancel.png', //指定取消上傳的圖片，默認(rèn)‘cancel.png'
'buttonImg':'<%=basePath%>images/upload2.jpg',
'auto' : true, //選定文件后是否自動上傳，默認(rèn)false
'folder' : '/userphoto' , //要上傳到的服務(wù)器路徑，默認(rèn)‘/'
'multi' : false, //是否允許同時上傳多文件，默認(rèn)false
'fileDesc' : '圖片文件' , //出現(xiàn)在上傳對話框中的文件類型描述
'fileExt' : '*.jpg;*.bmp;*.png;*.gif', //控制可上傳文件的擴(kuò)展名，啟用本項(xiàng)時需同時聲明fileDesc
'sizeLimit': 86400, //控制上傳文件的大小，單位byte
'onComplete': function(event,queueID,fileObj,response,data) {
$('#image').attr("src","<%=basePath%>userphoto/"+response);
$('#image').show();
$('#photo').attr("value",response);
},
'onError' : function(event, queueID, fileObj)
{
alert("文件:" + fileObj.name + " 上傳失敗");
}
});
});
</script>
2、注意事項(xiàng)
(1)、如果頁面沒有顯示“BROWSE”按鈕，則說明你的'uploader' : '<%=basePath%>images/uploadify.swf'配置不對，檢查下路徑是否正確。
(2)、如果需要修改按鈕的圖片：可以使用'buttonImg'配置進(jìn)行替換
(3)、上傳完成后，'onComplete'事件沒有觸發(fā)：在后臺servlet處理完后，要向頁面輸出1，否則頁面的onComplete回 調(diào)函數(shù)不會執(zhí)行。response.getWriter().write(1);
(4)、如果在后臺servlet處理上傳將圖片的名稱改變的話，就不能通過fileObj獲得它的值，而是要在后臺servlet輸出新文件 名：out.print(filename);在jsp頁面要相應(yīng)使用response來獲得新值。
(5)、圖片預(yù)覽實(shí)現(xiàn)：
在jsp頁面中添加一個<img src=""></img>,當(dāng)上傳完成后在onComplete事件中修改img的src值。
相關(guān)文章
JS跳出循環(huán)的方法區(qū)別對比分析(break,continue,return)
面向?qū)ο缶幊陶Z法中我們會碰到break ,continue, return這三個常用的關(guān)鍵字，那么關(guān)于這三個關(guān)鍵字的使用具體的操作是什么呢？接下來通過本文給大家講解JS跳出循環(huán)的方法區(qū)別對比分析(break,continue,return)，感興趣的朋友一起看看吧2023-02-02
這篇文章主要為大家詳細(xì)解析了DOM中事件處理概覽與原理，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-08-08
詳解javascript 正則表達(dá)式之分組與前瞻匹配
本文主要講解javascript 的正則表達(dá)式中的分組匹配與前瞻匹配的，需要對正則的有基本認(rèn)識，本人一直對兩種匹配模棱不清，還有不清楚的朋友跟隨腳本之家小編一起看看吧2018-05-05
JS SetInterval 代碼實(shí)現(xiàn)頁面輪詢
setInterval 是一個實(shí)現(xiàn)定時調(diào)用的函數(shù)，可按照指定的周期（以毫秒計(jì)）來調(diào)用函數(shù)或計(jì)算表達(dá)式。下面通過本文給大家分享JS SetInterval 代碼實(shí)現(xiàn)頁面輪詢，感興趣的朋友一起看看吧2017-08-08
微信頁面彈出鍵盤后iframe內(nèi)容變空白的解決方案
當(dāng)鍵盤彈出后，頁腳也被頂起來；而當(dāng)搜索完（要刷新整體頁面），鍵盤縮回后，iframe里 鍵盤當(dāng)住的地方變成白色。怎么解決這個問題呢？下面腳本之家小編給大家分享微信頁面彈出鍵盤后iframe內(nèi)容變空白的解決方案，一起看看吧2017-09-09
這篇文章主要為大家詳細(xì)介紹了原生js自定義右鍵菜單，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-09-09
這篇文章主要介紹了js如何獲取ajax的返回值,需要的朋友可以參考下2014-04-04
本文通過一段實(shí)例代碼給大家介紹了微信小程序日期選擇器的實(shí)現(xiàn)思路，非常不錯，具有一定的參考借鑒價(jià)值，需要的朋友參考下吧2018-07-07
javascript 節(jié)點(diǎn)遍歷函數(shù)
火狐官網(wǎng)上找到的一組函數(shù)，相當(dāng)于treeWalker，有了它可以方便地在IE實(shí)現(xiàn)Traversal API 2的所有功能2010-03-03
javascript高級模塊化require.js的具體使用方法
本篇文章主要介紹了javascript高級模塊化require.js的具體使用方法，非常具有實(shí)用價(jià)值，需要的朋友可以參考下2017-10-10