源**
function getobjecturl(file)
var url = null;
if (window.createobjecturl != undefined) else if (window.url != undefined) else if (window.webkiturl != undefined)
return url;
}
readasbinarystring
readasbinarystring的result應該是乙個二進位製流,而log出的結果是乙個夾雜著亂碼符號的文字,裡面還能看到是用ps儲存的之類的資訊。
readasdataurl
readasdataurl的result則是乙個base64的**,可以直接放入html的img標籤的屬性src上。
readastext
readastext的result和二進位制的顯示出來基本是一樣的,包括乙個資訊頭,接著大段的亂碼應該是本身。
該方法還有乙個可選的引數[encoding],即文字的編碼方式,預設為urf-8。
abort
abort是乙個特別的方法,用來打斷讀取。當上傳超時或者其他操作需要打斷時就可以呼叫這個介面打斷。另外還可以監聽abort事件來處理打斷後的情況。
實現檔案的非同步上傳,以及上傳的百分比顯示。
function getallfiles()
)return allfiles
}var filefilter=;
var url="/bind/upload/";
function onprogress(file, loaded, total)
function onsuccess(file,result)
function sureupload()
, false);
xhr.onreadystatechange = function(e)
} else }};
// 開始上傳
xhr.open("post", self.url, true);
xhr.setrequestheader("x_filename", escape(file.name));
xhr.send(file);
} })(file);
}}
值得一看的是後台的處理程式,這裡我們需要注意幾點
流儲存的時候選擇使用filestream才可以儲存。
在上面的**中,使用了目前只有在firefox和chrome中才支援的xmlhttprequest2物件,xmlhttprequest2是對原先大家熟悉的xmlhttprequest的加強,目前還沒最後定案,可以參考 的描述。在上面的**中,首先是判斷了上傳檔案的型別是否為檔案以及大小是否符合要求,如果符合要求的話,則呼叫send方法傳送檔案到服務端,並且這裡設定了http檔案頭x_filename為上傳的檔名。
參考**
html5檔案 上傳
表單提交檔案是最常見的場景,使用者選擇檔案後,觸發了檔案選擇框的change事件,通過訪問檔案選擇框元素的files屬性可以拿到選定的檔案列表。如果檔案選擇框指定了multiple,則乙個檔案選擇框可以同時選擇多個檔案,files包含了所有選擇的檔案物件 如果沒有指定,則只能選擇乙個檔案,files...
html5 檔案拖拽上傳
本文首先發表在 碼蜂筆記 html5 檔案拖拽上傳是個老話題了,網上有很多例子,我一開始的 也是網上找來改的,只是踩了幾個坑之後就想把過程記錄下來。下面主要介紹從瀏覽器外拖拽檔案到瀏覽器進行上傳的實現。首先會介紹一些必須的基礎。拖拽事件有下面這些 拖拽物件用來傳遞資料的媒介,通過拖拽事件的event...
HTML5 檔案讀取
檔案讀取 title head body input type file class file multiple img src alt id img script 由於 檔案的src屬性,可以通過採用網路位址或base64的方式顯示,因此我們可以利用readasdataurl實現對的預覽。獲取檔案...