在php中使用进度条和删除选项上载文件
我正在使用显示进度条和关闭按钮创建文件上载程序,但这些代码存在一些主要问题。它会继续显示进度条。主要问题是它会删除文件,但在刷新页面后,我的所有上载文件都不可见,我想从中删除一些文件。 我只想创建一个像gmail这样的文件下载器,它为用户上传的文件同时提供多个文件附件,并带有进度条和关闭按钮在php中使用进度条和删除选项上载文件,php,html,Php,Html,我正在使用显示进度条和关闭按钮创建文件上载程序,但这些代码存在一些主要问题。它会继续显示进度条。主要问题是它会删除文件,但在刷新页面后,我的所有上载文件都不可见,我想从中删除一些文件。 我只想创建一个像gmail这样的文件下载器,它为用户上传的文件同时提供多个文件附件,并带有进度条和关闭按钮 <script> $(document).ready(function() { $('#photoimg').die('click').li
<script>
$(document).ready(function() {
$('#photoimg').die('click').live('change', function()
{
//$("#preview").html('');
$("#imageform").ajaxForm({target: '#preview',
beforeSubmit:function(){
console.log('ttest');
$("#imageloadstatus").show();
$("#imageloadbutton").hide();
},
success:function(){
console.log('test');
$("#imageloadstatus").hide();
$("#imageloadbutton").show();
},
error:function(){
console.log('xtest');
$("#imageloadstatus").hide();
$("#imageloadbutton").show();
} }).submit();
});
});
</script>
<div class="wrap">
<?php
/**
* Multi file upload example
* @author Resalat Haque
* @link http://www.w3bees.com/2013/02/multiple-file-upload-with-php.html
**/
if(isset($_POST['submit']))
{
$valid_formats = array("jpg", "png", "gif", "zip", "bmp","doc","docx");
$max_file_size = 1024*100; //100 kb
$path = "uploads/"; // Upload directory
$count = 0;
if(isset($_POST) and $_SERVER['REQUEST_METHOD'] == "POST"){
// Loop $_FILES to execute all files
foreach ($_FILES['files']['name'] as $f => $name) {
if ($_FILES['files']['error'][$f] == 4) {
continue; // Skip file if any error found
}
if ($_FILES['files']['error'][$f] == 0) {
if ($_FILES['files']['size'][$f] > $max_file_size) {
$message[] = "$name is too large!.";
continue; // Skip large files
}
elseif( ! in_array(pathinfo($name, PATHINFO_EXTENSION), $valid_formats) ){
$message[] = "$name is not a valid format";
continue; // Skip invalid file formats
}
else{ // No error found! Move uploaded files
if(move_uploaded_file($_FILES["files"]["tmp_name"][$f], $path.$name)) {
$path="uploads/".$name;
?>
<div id='imageloadstatus' style='display:none'></div>
<div id='imageloadbutton'>
<script type="text/javascript">
<?php
echo "<a href=\"dl.php?file=".$name."\">".$name."</a> <a href=\"dl.php?file=".$name."\" > <img src='image/loader.gif' alt='Uploading....'/><img src=\"image/close.jpg\" /></a><br />";
$count++; // Number of successfully uploaded files
}
}
}
}
}
?>
<?php
# error messages
if (isset($message)) {
foreach ($message as $msg) {
printf("<p class='status'>%s</p></ br>\n", $msg);
}
}
# success message
if($count !=0){
printf("<p class='status'>%d files added successfully!</p>\n", $count);
}
?>
<br />
<?php } ?>
<!doctype html>
<html lang="en">
<head>
<style type="text/css">
/* Style goes here */
</style>
</head>
<body>
<!-- Multiple file upload html form-->
<form action="upload_demo.php" method="post" enctype="multipart/form-data" id="imageform">
<div id='preview'>
</div>
<input type="file" name="files[]" multiple="multiple" id="photoimg">
<input type="submit" value="Upload" name='submit'>
</form>
</div>
</body>
</html>
$(文档).ready(函数(){
$('#photoimg')。die('click')。live('change',function()
{
//$(“#预览”).html(“”);
$(“#imageform”).ajaxForm({target:'预览',
beforeSubmit:函数(){
console.log('ttest');
$(“#imageloadstatus”).show();
$(“#imageloadbutton”).hide();
},
成功:函数(){
console.log('test');
$(“#imageloadstatus”).hide();
$(“#imageloadbutton”).show();
},
错误:函数(){
console.log('xtest');
$(“#imageloadstatus”).hide();
$(“#imageloadbutton”).show();
}})提交();
});
});
如果要使用uploadify,可以执行以下操作:
您的html文件:
<!doctype html>
<html lang="en">
<head>
<style type="text/css">
/* Style goes here */
</style>
</head>
<body>
<ul id='image-list'></ul>
<!-- Multiple file upload html form-->
<form action="upload_file.php" method="post" enctype="multipart/form-data" id="imageform">
<input type='file' name='image-upload' id='image-upload' />
</form>
/*这里的风格*/
您的javascript文件:
function UploadifyInterface()
{
var self = this;
this.init = function()
{
$("#image-upload").uploadify({
height : 30,
swf : 'uploadify.swf',
uploader : $("#image-upload").closest("form").attr("action"),
fileTypeDesc : 'Image Files',
fileTypeExts : '*.gif; *.jpg; *.png',
onUploadSuccess : function(file, data, response) {
var image = data;
self.addImage(image.imageId, image.imagePath);
},
width : 120
});
}
this.addImage = function(id, path)
{
var imagePath = path.substr(strpos(path, "/", 2));
$("#image-list").append('<li><img width="120" height="120" src="'+imagePath+'" /><a href="/deleteimg">delete</a></li>');
$("#image-list > li").width(125);
}
}
var uploadify = new UploadifyInterface();
uploadify.init();
函数UploadifyInterface()
{
var self=这个;
this.init=函数()
{
$(“#图像上载”).uploadify({
身高:30,
swf:'uploadify.swf',
上传者:$(“#图像上传”).closest(“form”).attr(“action”),
fileTypeDesc:'图像文件',
fileTypeExts:'*.gif;*.jpg;*.png',
onUploadSuccess:函数(文件、数据、响应){
var图像=数据;
self.addImage(image.imageId,image.imagePath);
},
宽度:120
});
}
this.addImage=函数(id,路径)
{
var imagePath=path.substr(strpos(path,“/”,2));
$(“#图像列表”).append(“”);
$(“#图像列表>li”)。宽度(125);
}
}
var uploadify=新的UploadifyInterface();
uploadify.init();
现在您必须在php方面做一些工作:
将其命名为Uploader.php
<?php
abstract class FileUpload
{
abstract protected function PreProcessUpload($files);
abstract protected function GetLastError();
abstract protected function Response();
public function ProcessFileUpload($callback, $args)
{
if (!isset($_FILES['Filedata']) || !is_uploaded_file($_FILES['Filedata']['tmp_name']))
{
$response = array("error" => "File upload not valid!");
}
else if(!$this->PreProcessUpload($_FILES['Filedata']))
{
$response = $this->GetLastError();
}
else
{
// processed trough a callbackfunction
$args[count($args)] = $_FILES['Filedata'];
call_user_func_array($callback, $args);
$response = $this->Response();
}
header('Cache-Control: no-cache, must-revalidate');
header('Expires: Mon, 26 Jul 1997 05:00:00 GMT');
header('Content-Type: application/json');
echo json_encode($response);
exit;
}
}
public class Uploader extends FileUpload
{
private $error = NULL;
private $response = NULL;
....
protected function PreProcessUpload($files)
{
$size = @getimagesize($files['tmp_name']);
$result['size'] = $size;
if (($size[0] < 25) || ($size[1] < 25))
{
$this->response['error'] = 'Please upload an image bigger than 25px.';
return false;
}
return true;
}
protected function GetLastError()
{
if(is_array($this->response) && isset($this->response['error']))
{
return $this->response;
}
return array("error" => '');
}
protected function Response()
{
if(is_array($this->response))
{
return $this->response;
}
return array();
}
public function processImageUpload($id, $uploadImageInfo)
{
/* your processing here */
}
....
}
?>
然后使用该类:
将其命名为upload_file.php
<?php
include("Uploader.php");
$uploader = new Uploader();
$uploader->ProcessFileUpload(array($uploader , "processImageUpload"), array($id));
?>
编辑:添加了基本的php/html/javascript文件结构您想要这样的行为吗?是的,但上传的文件有doc、pdf和jpg、jpeg、png格式的图像文件,请看一下这些文件。您可以指定所需的扩展名。dl.php:当有人发送星号(*)时会发生什么?你检查用户输入了吗?它很完美,但是上传的文件在1秒或2秒后就看不见了。如何克服这个问题我的php代码可以吗?你能帮我处理我的php代码吗?因为我不能得到你的代码你想说什么,我只是使用核心php,所以我不能得到我必须放置此代码的地方。我只想要和iploadfive一样的代码,我也下载但是上传文件链接不起作用上传中上传文件的链接不起作用,我可以更改链接上传器:$(“#图像上传”).closest(“form”).attr(“action”),
的代码,或者使用action属性
<?php
include("Uploader.php");
$uploader = new Uploader();
$uploader->ProcessFileUpload(array($uploader , "processImageUpload"), array($id));
?>