实现Uploadify

由 ckk1988 翻译整理注：由于水平有限，欢迎指正。转载请务必注明出处。

Uploadify的目的是使实现尽可能地简单。在实现之前，请确保满足最低要求。

要求

jQuery 1.4.x 或更高版本
Flash Player 9.0.24 或更高版本
能够解析PHP，ASP.Net，Cold Fusion或类似的服务器端语言的服务器

实现

对于最基本的实现，请按照以下步骤进行：

1. 下载 Uploadify Zip Package. 免费的，不用担心!

2. 解压缩包并上传以下文件到一个文件夹在您的网站服务器：

jquery.uploadify-3.1.min.js
uploadify.php
uploadify.swf
uploadify.css
uploadify-cancel.png
check-exists.php (检查目标文件夹中存在的文件)

3.在网页上您是在实现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. 在服务器上创建上传的目标文件夹，并给它适当的权限（0755，如果不知道）。

9. 更新uploadify.php脚本来指向你的目标文件夹。

10.检查使Uploadify更安全，使网站更安全的文章。

最终的页面应该如下所示：

<!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

本站文章除注明转载外，均为本站原创或编译
欢迎任何形式的转载，但请务必注明出处，尊重他人劳动共创优秀实例教程
转载请注明：文章转载自：极客书 [http:/www.gitbook.net]
本文标题：实现Uploadify
本文地址：http://www.gitbook.net/uploadify/implementing-uploadify.html