index.html是:
<form id="fileupload" method="POST" action="UploadHandler.php" enctype="multipart/form-data">
<input type="file" id="files" name="files[]" multiple="multiple" title='Click to add Files'>
<input type="hidden" id="fileCnt" name="fileCnt" value="">
<input type="submit" name="btnAdd" id="btnAdd" class="buttonsub" value="Upload Files">
</form>
<script>
$('#fileupload').submit(function(e){
//window.location='assays.php';
var target = 'windowFormTarget';
window.open('', target, 'width=500,height=300');
this.setAttribute('target', target);
});
</script>
UploadHandler.php:
<html>
<head>
</head>
<body>
<table>
<th>Name</th>
<th>Size(in bytes)</th>
<th>Status</th>
<?php
for($i=0;$i<$_POST['fileCnt'];$i++)
{
echo '<tr>';
echo '<td>'.$_FILES['files']['name'][$i].'</td>';
echo '<td>'.$_FILES['files']['size'][$i].'</td>';
if($_FILES['files']['error'][$i] == 0)
{
//print"<pre>";print_r($_FILES);die;
//echo '<br/>'.$new_file_name = $_FILES['files']['name'][$i];
//move_uploaded_file($_FILES['files']['tmp_name'][$i], 'uploads/'.$new_file_name);die;
?>
<input type="hidden" name="name-<?php echo $i;?>" id="name-<?php echo $i;?>" value="<?php echo trim($_FILES['files']['name'][$i]);?>"/>
<input type="hidden" name="tmp_name-<?php echo $i;?>" id="tmp_name-<?php echo $i;?>" value="<?php echo trim($_FILES['files']['tmp_name'][$i]);?>"/>
<td>
<div class="progress" id="done-<?php echo $i;?>">
<div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="70" aria-valuemin="0" aria-valuemax="100" style="width:100%">
Done
</div>
</div>
<div class="progress" id="wait-<?php echo $i;?>">
<div class="progress-bar progress-bar-striped active" role="progressbar" aria-valuenow="70" aria-valuemin="0" aria-valuemax="100" style="width:100%">
Uploading..
</div>
</div>
</td>
</tr>
<?php }
}
?>
</table>
<script>
$(document).ready(function() {
var fileCnt = <?php echo $_POST['fileCnt']; ?>;
var j=0;
var files =<?php echo json_encode($_FILES);?>;
function doAjax(j,fileCnt) {
$("#wait-"+j).show();
$("#done-"+j).hide();
var name = $('#name-'+j).val();
var tmp_name = $('#tmp_name-'+j).val();
alert("#done-"+j);
$.ajax({
type: "POST",
url: "postdata.php",
data: {
'files':files,
'id':j,
'form_action': 'uploadFileData'
},
enctype:'multipart/form-data',
success: function($succ){
alert("result-"+$succ);
if($succ == 1){
$("#wait-"+j).hide();
$("#done-"+j).show();
}
j++;
if (j < fileCnt) {
doAjax(j,fileCnt);
}
}
});
}
doAjax(j,fileCnt);
});
</script>
</body>
</html>
我的postdata.php是:
if(isset($_POST) && !empty($_POST))
{
$new_file_name = trim($_POST['files']['files']['name'][$_POST['id']]);
$tmp_name = trim($_POST['files']['files']['tmp_name'][$_POST['id']]);
if(move_uploaded_file($tmp_name, 'uploads/'.$new_file_name))
{
echo "1";die;
}else{
echo "0";die;
}
}
当用户在index.html上提交表单时,UploadHandler.php会在新窗口中打开。在uploadhandler.php的load事件中,循环中的多个文件的ajax请求将文件上传到目录。 现在问题是文件没有上传,我无法调试问题。
请帮忙。
答案 0 :(得分:1)
从你的工作:我很抱歉,但这永远不会奏效。
如上所述,UploadHandler.php中的javascript可以访问文件名(甚至是tmp-names),但不能访问实际文件。
UploadHandler.php脚本接收文件($_FILES
)。也就是说,服务器软件将上传的文件放入一些具有随机文件名的临时目录(该文件名在$_FILES['files']['tmp_name'][$i]
中)。该脚本可以处理该文件。一件重要的事情是移动文件。该脚本开始编写html输出并将其发送到浏览器。然后,脚本完成,服务器将确保清理每个脚本。这意味着:删除上传的文件! (这就是为什么你应该移动它们,以防止这种情况。)
为了更好地理解文件上传的工作原理,最好再次阅读this php manual page上的问题。 The section on 'POST method uploads'实际上很好地解释了事情。
如果您真的想要一个进度条,建议您使用一些外部库。 This question and answers on SO可能会让你加快速度。
另请注意,通过ajax上传的文件尚未得到很好的支持,请参阅this answer on SO。
答案 1 :(得分:0)
$_FILES
而不是$_POST["files"]
吗?您需要更改这些行:
$new_file_name = trim($_POST['files']['files']['name'][$_POST['id']]);
$tmp_name = trim($_POST['files']['files']['tmp_name'][$_POST['id']]);
将它们更改为:
$new_file_name = trim($_FILES['files'][$_POST['id']]['name']);
$tmp_name = trim($_FILES['files'][$_POST['id']]['files']['tmp_name']);
此外,[$_POST['id']]
应该在["name"]
和["tmp_name"]
之前。