java uploadify 参数_Uploadify的一些参数
Uploadify是JQuery的一個上傳插件,實現的效果非常不錯,帶進度顯示。不過官方提供的實例時php版本的,本文將詳細介紹Uploadify在Aspnet中的使用,您也可以點擊下面的鏈接進行演示或下載。
首先按下面的步驟來實現一個簡單的上傳功能。
1 創建Web項目,命名為JQueryUploadDemo,從官網上下載最新的版本解壓后添加到項目中。
2 在項目中添加JQueryUploadHandler.ashx文件用來處理文件的上傳。
3 在項目中添加UploadFile文件夾,用來存放上傳的文件。
進行完上面三步后項目的基本結構如下圖:
4 Default.aspx的html頁的代碼修改如下:
Uploadify上傳| 取消上傳
5? UploadHandler類的ProcessRequest方法代碼如下:
public void ProcessRequest(HttpContext context){ context.Response.ContentType = "text/plain"; context.Response.Charset = "utf-8"; HttpPostedFile file = context.Request.Files["Filedata"]; string uploadPath = HttpContext.Current.Server.MapPath(@context.Request["folder"])+"\\"; if (file != null) { if (!Directory.Exists(uploadPath)) { Directory.CreateDirectory(uploadPath); } file.SaveAs(uploadPath + file.FileName); //下面這句代碼缺少的話,上傳成功后上傳隊列的顯示不會自動消失 context.Response.Write("1"); } else { context.Response.Write("0"); } }
6 運行后效果如下圖:
Uploadify有一個參數是 buttonText 這個無論你怎么改都不支持中文,因為插件在js里用了一個轉碼方法把這個參數的值轉過碼了,解碼的地方在那個swf文件里,看不到代碼,所以這條路不行。
另一個參數,網上很少提到,是 buttonImg( 按鈕圖片),這時你完全可以用一個圖片來替換掉插件自帶的那個黑色的flash瀏覽按鈕,只要你自己的圖片上是中文,這不就解決了中文按鈕問題么?如果只加這一個,你會發現你的按鈕圖片下面有一片白色區域,其實就是那個flash留下的,白色區域表示鼠標可用范圍,這個范圍可以用width,height來調整。還有一個參數 wmode 它的默認值是opaque,把它改成transparent就行了,也就是把那片白色區域透明化
如果您在上傳的過程中出現了亂碼,無非是程序編碼和系統編碼不一致造成的,于是嘗試修改uploadify.php文件。您可以嘗試將move_uploaded_file($tempFile,$targetFile);?? 修改為move_uploaded_file($tempFile,iconv("UTF-8","gb2312", $targetFile));?? 刷新頁面,上傳中文文件。
下面介紹一下它的一些參數:
uploader : uploadify.swf 文件的相對路徑,該swf文件是一個帶有文字BROWSE的按鈕,點擊后彈出打開文件對話框,默認值:uploadify.swf。
script : 后臺處理程序的相對路徑 。默認值:uploadify.php
checkScript :用來判斷上傳選擇的文件在服務器是否存在的后臺處理程序的相對路徑
fileDataName :設置一個名字,在服務器處理程序中根據該名字來取上傳文件的數據。默認為Filedata
method : 提交方式Post 或Get 默認為Post
scriptAccess :flash腳本文件的訪問模式,如果在本地測試設置為always,默認值:sameDomain
folder : 上傳文件存放的目錄 。
queueID : 文件隊列的ID,該ID與存放文件隊列的div的ID一致。
queueSizeLimit : 當允許多文件生成時,設置選擇文件的個數,默認值:999 。
multi : 設置為true時可以上傳多個文件。
auto : 設置為true當選擇文件后就直接上傳了,為false需要點擊上傳按鈕才上傳 。
fileDesc : 這個屬性值必須設置fileExt屬性后才有效,用來設置選擇文件對話框中的提示文本。
fileExt : 設置可以選擇的文件的類型,格式如:'*.doc;*.pdf;*.rar' 。
sizeLimit : 上傳文件的大小限制 。
simUploadLimit : 允許同時上傳的個數 默認值:1 。
buttonText : 瀏覽按鈕的文本,默認值:BROWSE 。
buttonImg : 瀏覽按鈕的圖片的路徑 。
hideButton : 設置為true則隱藏瀏覽按鈕的圖片 。
rollover : 值為true和false,設置為true時當鼠標移到瀏覽按鈕上時有反轉效果。
width : 設置瀏覽按鈕的寬度 ,默認值:110。
height : 設置瀏覽按鈕的高度 ,默認值:30。
wmode : 設置該項為transparent 可以使瀏覽按鈕的flash背景文件透明,并且flash文件會被置為頁面的最高層。 默認值:opaque 。
cancelImg :選擇文件到文件隊列中后的每一個文件上的關閉按鈕圖標
上面介紹的key值的value都為字符串或是布爾類型,比較簡單,接下來要介紹的key值的value為一個函數,可以在選擇文件、出錯或其他一些操作的時候返回一些信息給用戶。
onInit : 做一些初始化的工作。
onSelect :選擇文件時觸發,該函數有三個參數
event:事件對象。
queueID:文件的唯一標識,由6為隨機字符組成。
fileObj:選擇的文件對象,有name、size、creationDate、modificationDate、type 5個屬性。
代碼如下:
$(document).ready(function(){ $("#uploadify").uploadify({ 'uploader': 'JS/jquery.uploadify-v2.1.0/uploadify.swf', 'script': 'UploadHandler.ashx', 'cancelImg': 'JS/jquery.uploadify-v2.1.0/cancel.png', 'folder': 'UploadFile', 'queueID': 'fileQueue', 'auto': false, 'multi': true, 'onInit':function(){alert("1");}, 'onSelect': function(e, queueId, fileObj) { alert("唯一標識:" + queueId + "\r\n" + "文件名:" + fileObj.name + "\r\n" + "文件大小:" + fileObj.size + "\r\n" + "創建時間:" + fileObj.creationDate + "\r\n" + "最后修改時間:" + fileObj.modificationDate + "\r\n" + "文件類型:" + fileObj.type ); } });});
當選擇一個文件后彈出的消息如下圖:
onSelectOnce :在單文件或多文件上傳時,選擇文件時觸發。該函數有兩個參數event,data,data對象有以下幾個屬性:
fileCount:選擇文件的總數。
filesSelected:同時選擇文件的個數,如果一次選擇了3個文件該屬性值為3。
filesReplaced:如果文件隊列中已經存在A和B兩個文件,再次選擇文件時又選擇了A和B,該屬性值為2。
allBytesTotal:所有選擇的文件的總大小。
onCancel : 當點擊文件隊列中文件的關閉按鈕或點擊取消上傳時觸發。該函數有event、queueId、fileObj、data四個參數,前三個參數同onSelect 中的三個參數,data對象有兩個屬性fileCount和allBytesTotal。
fileCount:取消一個文件后,文件隊列中剩余文件的個數。
allBytesTotal:取消一個文件后,文件隊列中剩余文件的大小。
onClearQueue :當調用函數fileUploadClearQueue時觸發。有event和data兩個參數,同onCancel 中的兩個對應參數。
onQueueFull :當設置了queueSizeLimit并且選擇的文件個數超出了queueSizeLimit的值時觸發。該函數有兩個參數event和queueSizeLimit。
onError :當上傳過程中發生錯誤時觸發。該函數有event、queueId、fileObj、errorObj四個參數,其中前三個參數同上,errorObj對象有type和info兩個屬性。
type:錯誤的類型,有三種‘HTTP’, ‘IO’, or ‘Security’
info:錯誤的描述
onOpen :點擊上傳時觸發,如果auto設置為true則是選擇文件時觸發,如果有多個文件上傳則遍歷整個文件隊列。該函數有event、queueId、fileObj三個參數,參數的解釋同上。
onProgress :點擊上傳時觸發,如果auto設置為true則是選擇文件時觸發,如果有多個文件上傳則遍歷整個文件隊列,在onOpen之后觸發。該函數有event、queueId、fileObj、data四個參數,前三個參數的解釋同上。data對象有四個屬性percentage、bytesLoaded、allBytesLoaded、speed:
percentage:當前完成的百分比
bytesLoaded:當前上傳的大小
allBytesLoaded:文件隊列中已經上傳完的大小
speed:上傳速率 kb/s
onComplete:文件上傳完成后觸發。該函數有四個參數event、queueId、fileObj、response、data五個參數,前三個參數同上。response為后臺處理程序返回的值,在上面的例子中為1或0,data有兩個屬性fileCount和speed
fileCount:剩余沒有上傳完成的文件的個數。
speed:文件上傳的平均速率 kb/s
onAllComplete:文件隊列中所有的文件上傳完成后觸發。該函數有event和data兩個參數,data有四個屬性,分別為:
filesUploaded :上傳的所有文件個數。
errors :出現錯誤的個數。
allBytesLoaded :所有上傳文件的總大小。
speed :平均上傳速率 kb/s
相關函數介紹
在上面的例子中已經用了uploadifyUpload和uploadifyClearQueue兩個函數,除此之外還有幾個函數:
uploadifySettings:可以動態修改上面介紹的那些key值,如下面代碼
$('#uploadify').uploadifySettings('folder','JS');
如果上傳按鈕的事件寫成下面這樣,文件將會上傳到uploadifySettings定義的目錄中
上傳
uploadifyCancel:該函數接受一個queueID作為參數,可以取消文件隊列中指定queueID的文件。
$('#uploadify').uploadifyCancel(id);
以下是可選項的參數說明:(紅色的屬性代表常用的)
1
uploader
上傳控件的主體文件,flash控件
默認值='uploadify.swf'
2
script
相對路徑的后端腳本,它將處理您上傳的文件。
絕對路徑前綴或'/'或'http'的路徑
默認值='uploadify.php'
3
checkScript
檢查該文件是否已經選擇駐留在服務器上。
沒有默認值。 官方例子中'check.php'是提供核心文件
4
scriptData
可提供URL傳遞參數。用來傳遞get參數。例如:
index.jsp?id=1&action=uploadify可以設置成:
'script': 'index.jsp',
'scriptData':{'id':1,'action':'uploadify'},
注:要設置‘method’:‘GET’.
5
fileDataName
您的文件在上傳服務器腳本陣列的名稱。
默認值='Filedata'
6
method
設置為發送到后端腳本的方法。要么'get'或post'。
默認值'post'
8
folder
您想將文件保存到的路徑。考慮到安全問題,一般并不在客戶端設定后供服務器得到所存的路徑。我試了下。這個參數好像以get的方式傳遞的。設定post得不到這個值。
9
queueID
文件隊列ID。與div的id一致。參考上一篇例子的用法。
10
queueSizeLimit
限制在一次隊列中的次數(可選定幾個文件)。默認值= 999,而一次可傳幾個文件有 simUploadLimit屬性決定。
11
multi
是否允許同時上傳多文件,可設定true或false。
默認false。設定true時,選中的文件是當前項。
12
auto
選定文件后是否自動上傳,可設定true或false。
默認false
13
fileDesc
出現在上傳對話框中的文件類型描述。與fileExt需同時使用
14
fileExt
支持的格式,啟用本項時需同時聲明fileDesc。
如:‘*.rar,*.doc
15
sizeLimit
控制上傳文件的大小,單位byte
16
simUploadLimit
多文件上傳時,同時上傳文件數目限制。默認1
一次可傳幾個文件。
17
buttonText
默認按鈕的名字。默認BROWER
18
使用圖片按鈕,設定圖片的路徑即可。
19
hideButton
上傳按鈕的隱藏。true 或false。默認flase
20
rollover
?
21
width
按鈕圖片的長度。默認 110
22
height
按鈕圖片的高度。默認 30
23
wmode
背景透明transparent 與不透明opaque設定。默認 不透明
24
cancelImg
取消按鈕。設定圖片路徑。默認cancel.png
25
onInit
函數, 初始化時的狀態。
onInit: function() {
$("#id").html("上傳前");},
26
onComplete
event: 事件對象
queueID: 完成文件的唯一標識符。
fileObj:
? name – 文件名
? filepath –上傳路徑
? size – 文件大小
? creationDate – 文件創建時間
? modificationDate –文件最近修改時間
? type –文件的擴展名
response: 服務器回調的數據
data:
? fileCount – The total number of files left in the queue
? speed – 平均上傳速度 KB/s
如:
onComplete: function(event, queueID, fileObj) {
alert("文件:" +fileObj.name + "上傳失敗");?}
27
onSelectOnce
函數:可傳遞二個參數
event: The event object.
data: An object containing details about the select operation.
? fileCount – The total number of files in the queue
? filesSelected – The number of files selected in the select operation
? filesReplaced – The number of files that were replaced in the queue
? allBytesTotal – The total number of bytes for all files in the queue
28
onCancel
函數:可傳遞四個參數
event: The event object.
queueID: The unique identifier of the file that was cancelled.
fileObj: An object containing details about the file that was selected.
? name – The name of the file
? size – The size in bytes of the file
? creationDate – The date the file was created
? modificationDate – The last date the file was modified
? type – The file extension beginning with a '.'
data: Details about the file queue.
? fileCount – The total number of files left in the queue
? allBytesTotal – The total number of bytes left for all files in the queue
29
onClearQueue
函數:可傳遞一個參數
event: The event object.
30
onQueueFull
函數:可傳遞二個參數
? event - The event object.
? queueSizeLimit - The maximum size of the queue.
31
onError
event: The event object.
queueID: The unique identifier of the file that was errored.
fileObj: An object containing details about the file that was selected.
? name – The name of the file
? size – The size in bytes of the file
? creationDate – The date the file was created
? modificationDate – The last date the file was modified
? type – The file extension beginning with a '.'
errorObj: An object containing details about the error returned.
? type – Either 'HTTP', 'IO', or 'Security'
? info – An error message describing the type of error returned
32
onOpen
函數:可傳遞三個參數
event: The event object.
queueID: The unique identifier of the file that was opened.
fileObj: An object containing details about the file that was selected.
? name – The name of the file
? size – The size in bytes of the file
??creationDate – The date the file was created
? modificationDate – The last date the file was modified
? type – The file extension beginning with a '.'
33
onProgress
函數:可傳遞四個參數
event: The event object.
queueID: The unique identifier of the file that was updated.
fileObj: An object containing details about the file that was selected.
? name – The name of the file
? size – The size in bytes of the file
? creationDate – The date the file was created
? modificationDate – The last date the file was modified
? type – The file extension beginning with a '.'
data: An object containing details about the upload and queue.
? percentage – The current percentage completed for the upload
? bytesLoaded – The current amount of bytes uploaded
? allBytesLoaded – The current amount of bytes loaded for all files in the queue
? speed – The current upload speed in KB/s
34
onSelect
event: The event object.
queueID: The unique identifier of the file that was selected.
fileObj: An object containing details about the file that was selected.
? name – The name of the file
? size – The size in bytes of the file
? creationDate – The date the file was created
? modificationDate – The last date the file was modified
? type – The file extension beginning with a '.'
35
onAllComplete
event: The event object.
data: An object containing details about the upload process.
? filesUploaded – The total number of files uploaded
? errors – The total number of errors while uploading
? allbytesLoaded – The total number of bytes uploaded
? speed – The average speed of all uploaded files
36
onCheck
函數:可傳遞五個參數
event: The event object.
checkScript: The path to the file checking script.
fileQueue: A file queue object consisting of?key/value pairs with the queue ID as the key and the filename as the value.
folder: The path to the upload folder.
single: True if only one file is being uploaded from the queue.
總結
以上是生活随笔為你收集整理的java uploadify 参数_Uploadify的一些参数的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: Android签名证书:jks和keys
- 下一篇: lg v35 thinkq刷韩版andr