HTML 部份
<head>
<script type="text/javascript" src="ajaxupload.3.5.js"></script>
</head>
<form action="upload.do" method="post" enctype="multipart/form-data">
<img name="img1" id="img1" width="80" height="80">
<span id="button1" class="button">上傳</span>
</form>
JS 部份
<script type= "text/javascript">
$(document).ready(function(){
var button = $(\'#button1\'), interval;
new AjaxUpload(button,{
action: \'rpc.php\', // I disabled uploads in this example for security reasons
name: \'myfile\',
data: {
act: \'<{php}>echo base64_encode(\'上傳檔案\')<{/php}>\',
},
onSubmit : function(file, ext){
// change button text, when user selects file
button.text(\'檔案上傳中\');
// If you want to allow uploading only 1 file at time,
// you can disable upload button
this.disable();
// Uploding -> Uploading. -> Uploading...
interval = window.setInterval(function(){
var text = button.text();
if (text.length < 13){
button.text(text + \'.\');
} else {
button.text(\'檔案上傳中\');
}
}, 200);
},
onComplete: function(file, response){
button.text(\'上傳\');
window.clearInterval(interval);
// enable upload button
this.enable();
// add file to the list
$(\'#img2\').attr("src", function() {
return "../tmp/" + file;
});
}
});
});
</script>
PHP 部份
與一般上傳檔案的處理方式相同。
|