實現(xiàn)Uploadify

Uploadify的目的是使實現(xiàn)盡可能地簡單。在實現(xiàn)之前，請確保滿足最低要求。

要求

jQuery 1.4.x 或更高版本
Flash Player 9.0.24 或更高版本
能夠解析PHP，ASP.Net，Cold Fusion或類似的服務(wù)器端語言的服務(wù)器

實現(xiàn)

對于最基本的實現(xiàn)，請按照以下步驟進行：

1. 下載 Uploadify Zip Package. 免費的，不用擔(dān)心!

2. 解壓縮包并上傳以下文件到一個文件夾在您的網(wǎng)站服務(wù)器：

jquery.uploadify-3.1.min.js
uploadify.php
uploadify.swf
uploadify.css
uploadify-cancel.png
check-exists.php (檢查目標(biāo)文件夾中存在的文件)

3.在網(wǎng)頁上您是在實現(xiàn)Uploadify，所以首先要添加一個jQuery庫。

<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>

4. 下面引用jQuery，添加一個引用到Uploadify腳本。

<script type="text/javascript" src="/jquery.uploadify-3.1.min.js"></script>

5. 在頁面上，添加一個文件輸入（或用一個ID的任何其他元素）。

<input type="file" name="file_upload" id="file_upload" />

6.在代碼文件輸入初始化Uploadify。

$(function() {
    $('#file_upload').uploadify({
        'swf'      : 'uploadify.swf',
        'uploader' : 'uploadify.php'
        // Put your options here
    });
});

7. 添加一個鏈接到Uploadify樣式表中的文檔頭部。

<link rel="stylesheet" type="text/css" href="uploadify.css" />

8. 在服務(wù)器上創(chuàng)建上傳的目標(biāo)文件夾，并給它適當(dāng)?shù)臋?quán)限（0755，如果不知道）。

9. 更新uploadify.php腳本來指向你的目標(biāo)文件夾。

10.檢查使Uploadify更安全，使網(wǎng)站更安全的文章。

最終的頁面應(yīng)該如下所示：

<!DOCTYPE html>
<html>
<head>
<title>My Uploadify Implementation</title>
<link rel="stylesheet" type="text/css" href="uploadify.css">
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="jquery.uploadify-3.1.min.js"></script>
<script type="text/javascript">
	    $(function() {
	        $('#file_upload').uploadify({
	            'swf'      : 'uploadify.swf',
	            'uploader' : 'uploadify.php'
	            // Your options here

	        });
	    });
</script>
</head>
<body>
	<input type="file" name="file_upload" id="file_upload" />
</body>
</html>

上一篇：uploadify自定義服務(wù)器端上傳腳本下一篇：Uploadify教程