20,359
社区成员
发帖
与我相关
我的任务
分享
<script>
function ajaxFileUpload() {
$.ajax({
url: 'a.php',
type: 'post',
dateType: 'json',
data: {upfile:$("#ss").val()},
success: function (result) {
alert("success");
},
error: function (result) {
alert("error");
}
});
}
</script>
<body>
<form enctype="multipart/form-data" action="a.php" method="post" name="upform" id="upform">
上传文件:
<input name="upfile" type="file" onchange="ajaxFileUpload()" id="ss">
<input type="submit" value="上传"><br>
</form>
</body>
a.php
if (!is_uploaded_file($_FILES["upfile"]["tmp_name"]))
//如果我直间提交表单 $_FILES是有值的 (Array ( [upfile] => Array ( [name] => 1.jpg [type] => image/jpeg [tmp_name] => C:\Windows\phpC106.tmp [error] => 0 [size] => 7108 ) ) )
//但我用ajax提交时, $_FILES是没有值,这个要怎么解决?
{
echo "图片不存在!";
exit;
}
<div class="file_upload_control">
<form class="file_control_form" enctype="multipart/form-data" action="ajax/upload.image.php"
target="iframe_2C4B15FAD29E311E3CBACEADE9EE8F4A" method="post">
<input type="hidden" name="APC_UPLOAD_PROGRESS" class="apc_id" value="2C4B15FAD29E311E3CBACEADE9EE8F4A"
/>
<input type="hidden" value="2C4B15FAD29E311E3CBACEADE9EE8F4A" name="file_control_guid"
/>
<input type="hidden" value="module_menu" name="file_control_module" />
<!-----2C4B15FAD29E311E3CBACEADE9EE8F4A 这个是GUID----->
可以同时上传多个文件,用GUID进行区分
<input name="2C4B15FAD29E311E3CBACEADE9EE8F4A" class="file_control" type="file"
/>
<div class="file_preview"> <!---- 图片上传前预览----->
<img class="file_preview_img" />
</div>
<div class="opacity file_error"> <!----- 文件验证错误提示---->
<div class="tip">
</div>
</div>
<div class="opacity file_progress"> <!---- 文件上传进度条----->
<div class="total">
<div class="current">
</div>
</div>
</div>
<div class="opacity file_uploaded"> <!----- 上传成功后的Logo标志------>
<div class="success">
</div>
</div>
<div class="delete"> <!----- 上传成功后 删除按钮 ----->
<img src="images/upload_delete.png" />
</div>
</div>
</form>
<!---- iframe 是异步提交的关键, 注意iframe name属性要和form target中的值完全一致 ----->
<iframe style="display:none" src="" id="iframe_2C4B15FAD29E311E3CBACEADE9EE8F4A"
name="iframe_2C4B15FAD29E311E3CBACEADE9EE8F4A">
</iframe>
</div>
$(document).on('change','.file_upload_control .file_control',function(){
//第一步获取file值
var file = $(this).val();
//第二步上传前校验
if(!CheckFile(file)){
ClearFileControl($(this)); //清空文件的内容
return;
}
//第三步,如果上传的是图片,在本地进行上传前的预览
PreviewImg($file);
//第四步,提交上传
$(this).parent().submit(); //提交form
//第五步,如果上传的文件比较大(100M),查询进度,记得配置服务器支持大文件,否则上传不会成功!
var file_guid = $(this).siblings('.file_control_guid').val();
//第六步,查询文件上传进度,需要服务端程序进行配合,我这里举例的是PHP代码,需要使用PHP_APC.dll第三方插件协助 完成
setTimeout('GetUploadProgress("'+file_guid+'"),500);
});