非常に使いやすいjquery ajaxファイルのアップロードプラグイン
13563 ワード
公式サイト:http://www.phpletter.com/Demo/AjaxFileUpload-Demo/
ファイルのダウンロード:ここをクリックしてください.
ダウンロードしたファイルを解凍した後、ajaxfileuplad.phpというファイルがプレゼンテーションされていますので、ご覧ください.
その中でajaxを使ってアップロードするには必要な導入ファイルがあります.
ファイルアップロードのinputとアップロードのボタンを書き込みます.
ファイルのダウンロード:ここをクリックしてください.
ダウンロードしたファイルを解凍した後、ajaxfileuplad.phpというファイルがプレゼンテーションされていますので、ご覧ください.
その中でajaxを使ってアップロードするには必要な導入ファイルがあります.
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="ajaxfileupload.js"></script>
cssファイルは構いません.ファイルアップロードのinputとアップロードのボタンを書き込みます.
<input id="fileToUpload" type="file" size="45" name="fileToUpload">
<button class="button" id="buttonUpload" onClick="return ajaxFileUpload();"> </button>
アップロードボタンをクリックした時にajaxFileUpload()関数を実行しますので、この関数の具体的な内容を追加します.<script type="text/javascript">
function ajaxFileUpload()
{
$("#loading")// ( )
.ajaxStart(function(){
$(this).show();
})
.ajaxComplete(function(){
$(this).hide();
});
$.ajaxFileUpload
(
{
url:'doajaxfileupload.php',// php
secureuri:false,
fileElementId:'fileToUpload',// input id
dataType: 'json',
data:{name:'logan', id:'id'},
success: function (data, status)
{
if(typeof(data.error) != 'undefined')
{
if(data.error != '')
{
alert(data.error);//
}else
{
alert(data.msg);//
}
}
},
error: function (data, status, e)
{
alert(e);
}
}
)
return false;
}
</script>
doajaxfileupload.php
:
<?php
$error = "";
$msg = "";
$fileElementName = 'fileToUpload';// input (name )
if(!empty($_FILES[$fileElementName]['error']))
{
switch($_FILES[$fileElementName]['error'])//
{
case '1':
$error = 'The uploaded file exceeds the upload_max_filesize directive in php.ini';
break;
case '2':
$error = 'The uploaded file exceeds the MAX_FILE_SIZE directive that was specified in the HTML form';
break;
case '3':
$error = 'The uploaded file was only partially uploaded';
break;
case '4':
$error = 'No file was uploaded.';
break;
case '6':
$error = 'Missing a temporary folder';
break;
case '7':
$error = 'Failed to write file to disk';
break;
case '8':
$error = 'File upload stopped by extension';
break;
case '999':
default:
$error = 'No error code avaiable';
}
}elseif(empty($_FILES[$fileElementName]['tmp_name']) || $_FILES[$fileElementName]['tmp_name'] == 'none')
{
$error = 'No file was uploaded..';
}else
{
$msg .= " File Name: " . $_FILES[$fileElementName]['name'] . ", ";
$msg .= " File Size: " . @filesize($_FILES[$fileElementName]['tmp_name']);
// , , , , $error
@unlink($_FILES[$fileElementName]);
}
echo "{";
echo "error: '" . $error . "',
";
echo "msg: '" . $msg . "'
";
echo "}";
?>
特に注意すべきなのは、このプラグインはphpアップロード処理ファイルの中にエラー情報が中国語であると文字化けが発生しやすいので、phpファイルにこの文を追加すれば大丈夫です.header("Content-type: text/html; charset=utf-8");