jQuery上傳外掛Uploadify的使用方法

下載免費的Uploadify包 ：http://www.uploadify.com/downloads

jquery版本1.4+

<script src="jquery.js"></script>
<script src="jquery.uploadify-3.1.min.js"></script>
<link rel="stylesheet" type="text/css" href="uploadify.css" />

頁面中

	<input type="file" name="file_upload" id="file_upload" />
	<button class='start'>start</button>
	<div id="show"></div>

js

<script type="text/javascript">
	$(function() {
    $('#file_upload').uploadify({
        'swf'      : 'uploadify.swf',
        'uploader' : 'uploadify.php',
        'auto' : false, 			// 是否自動上傳
        'buttonText' : '上傳檔案',  //改按鈕名字
        //'width' : '300',
        //'height' : '200',
        'onUploadSuccess' : function(file,data,response){   //上傳後顯示，這個要改uploadify裡面輸出內容
        	html="<p><img src='"+data+"'></p>";

        	$('#show').append(html);
        },
    });
    $('.start').click(function() {  //點選按鈕才上傳
    	$('#file_upload').uploadify('upload','*');
    })
});
</script>

uploadify

<script type="text/javascript">
	$(function() {
    $('#file_upload').uploadify({
        'swf'      : 'uploadify.swf',
        'uploader' : 'uploadify.php',
        'auto' : false, 			// 是否自動上傳
        'buttonText' : '上傳檔案',  //改按鈕名字
        //'width' : '300',
        //'height' : '200',
        'onUploadSuccess' : function(file,data,response){   //上傳後顯示，這個要改uploadify裡面輸出內容
        	html="<p><img src='"+data+"'></p>";

        	$('#show').append(html);
        },
    });
    $('.start').click(function() {  //點選按鈕才上傳
    	$('#file_upload').uploadify('upload','*');
    })
});
</script>