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 部份
與一般上傳檔案的處理方式相同。
|
