建立test文件夹
PHP代码：
<?php//var_dump($_FILES['file']);
exit;
if(isset($_GET['option']) && $_GET['option']=='delete'){
@file_put_contents(dirname(__FILE__)."/------------0.txt", $_GET['path']."rn",FILE_APPEND);
unlink($_GET['path']);
$rs[] = array( 'success'=>true, 'info'=>'ok' );
if(file_exists($_GET['path'])){
$rs[]['success']=false;
$rs[]['info']='未删除';
}
die(json_encode($rs));
}
if ((($_FILES["file"]["type"] == "image/gif")|| ($_FILES["file"]["type"] == "image/jpeg")|| ($_FILES["file"]["type"] == "image/png")|| ($_FILES["file"]["type"] == "image/pjpeg"))&& ($_FILES["file"]["size"] < (1024*1024))){
if ($_FILES["file"]["error"] > 0) {
echo "Return Code: " . $_FILES["file"]["error"] . "<br />";
}
else {
if (file_exists("test/" . $_FILES["file"]["name"])) {
$fn = $_FILES["file"]["name"];
}
else {
$imgurl = substr($_FILES["file"]["name"], strpos($_FILES["file"]["name"], '.'));
$imgurl = date("YmdHis",time()).$imgurl;
move_uploaded_file($_FILES["file"]["tmp_name"],"test/" . $imgurl);
$fn = "test/" . $imgurl;
}
}
$return_str[] = array( 'guid'=>date('His',time()), 'path'=>'test/', 'fileName'=>$fn, 'success'=>true );
}
else{
$return_str[] = array( 'guid'=>date('His',time()), 'path'=>'test/', 'fileName'=>$_FILES["file"]["name"], 'success'=>false, 'error'=>$_FILES["file"]["error"] );
}
echo json_encode($return_str);
?>
HTML代码：
<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv="Content-Type" content="multipart/form-data;
charset=utf-8" /> <title>文件上传</title> <style type="text/css"> .btn {
position: relative;
background-color: blue;
width: 80px;
text-align: center;
font-size: 12px;
color: white;
line-height: 30px;
height: 30px;
border-radius: 4px;
}
.btn:hover {
cursor: pointer;
}
.btn input {
opacity: 0;
filter: alpha(opacity=0);
position: absolute;
top: 0px;
left: 0px;
line-height: 30px;
height: 30px;
width: 80px;
}
#fileLsit li span {
margin-left: 10px;
color: red;
}
#fileLsit {
font-size: 12px;
list-style-type: none;
}
</style></head><body> <div class="btn"> <span>添加附件</span> <!--这里注意：file 标签必须具有name属性，由于没有加name属性，文件上传不到服务到哪--> <input type="file" id="fileName" name="file" /> </div> <ul id="fileLsit" style="border:1px solid red;
"> </ul> <!--引入jquery类库--> <script type="text/javascript" src="js/jquery.js"></script> <!--引入jquery.form插件--> <script type="text/javascript" src="js/jquery.form.js"></script> <script type="text/javascript"> jQuery(function () {
var option = {
type: 'post', dataType: 'json', //数据格式为json resetForm: true, beforeSubmit: showRequest,//提交前事件 uploadProgress: uploadProgress,//正在提交的时间 success: showResponse//上传完毕的事件 }
jQuery('#fileName').wrap( '<form method="post" action="test.php" id="myForm2" enctype="multipart/form-data"></form>');
jQuery('#fileName').change(function () {
$('#myForm2').ajaxSubmit(option);
}
);
}
);
//删除文件 var deleteFile = function (path, guid) {
console.log(path+'/'+guid);
jQuery.getJSON('test.php?option=delete', {
path: path }
, function (reslut) {
console.log(path+'/'+guid+''+reslut[0].info);
if (reslut[0].success) {
//删除成功 jQuery('#' + guid).remove();
console.log('删除成功');
}
else {
//删除失败 alert(reslut[0].info);
}
}
);
console.log('end');
}
//上传中 var uploadProgress = function (event, position, total, percentComplete) {
jQuery('.btn span').text('上传中...');
}
//开始提交 function showRequest(formData, jqForm, options) {
jQuery('.btn span').text('开始上传..');
var queryString = $.param(formData);
}
//上传完成 var showResponse = function (responseText, statusText, xhr, $form) {
console.log(responseText);
if (responseText[0].success) {
//成功之后返回文件地址、文件名称等信息 拼接呈现到html里面。 var str = '<li id="' + responseText[0].guid + '"><a href="' + responseText[0].fileName + '" target="_blank">' + responseText[0].fileName + '</a><span onclick="deleteFile('' + responseText[0].fileName + '','' + responseText[0].guid + '')" >删除</span></li>';
jQuery('#fileLsit').append(str);
}
jQuery('.btn span').text('上传完成');
jQuery('.btn span').text('添加附件');
}
</script></body></html>
以上所述是小编给大家介绍的jQuery.Form上传文件操作，希望对大家有所帮助，如果大家有任何疑问欢迎给留言，小编会及时回复大家的！
