官方网站:http://www.phpletter.com/Demo/AjaxFileUpload-Demo/
文件下载:点击这里
把下载好的文件解压后里面有ajaxfileupload.php这个文件是演示的,大家可以看看。
其中要使用ajax上传必要的引入文件有:
<script type="text/javascript" src="jquery.js"></script> <script type="text/javascript" src="ajaxfileupload.js"></script>
css文件无所谓。
在html中写入一个文件上传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 . "',\n";
echo "msg: '" . $msg . "'\n";
echo "}";
?>
特别值得注意的是这个插件在php上传处理文件中如果错误信息是中文的很容易出现乱码的情况,所以在php文件中要加上这句话就没有问题了:
header("Content-type: text/html; charset=utf-8");
提供PHP及ThinkPHP框架的定制开发、代码优化,PHP修改、ThinkPHP修改。