我写了一个脚本来存储我的数据库中的图像。图像具有也上载和存储的标题。这很容易上班。我有一个jquery函数设置,每次单击一个按钮时添加一个新的文件输入和标题输入。这也有效。
什么不起作用我的PHP由于某种原因没有上传多个文件。
有人能告诉我我做错了吗?
谢谢:)
HTML:
<form id="uploadMultiple" method="post" action="/scripts/php/imageUploadTest" enctype="multipart/form-data">
<table class="fileUploadTable" id="uploadArea" cellspacing="0">
<tr>
<td>
<label for="imageFile">Image:</label>
<input type="file" name="imageFile" accept=".jpg,.jpeg,.png,.gif">
</td>
<td>
<label for="imageCaption">Image Caption:</label>
<input type="text" name="imageCaption">
</td>
<td width="150px">
</td>
</tr>
<tr id="uploadSubmission">
<td>
<input type="submit" value="Upload More" id="uploadMore">
</td>
<td>
<input type="submit" value="Submit" name="addImage">
</td>
<td width="150px">
</td>
</tr>
</table>
</form>
用于添加新元素的JQuery:
$(function() {
var scntDiv = $('#uploadArea');
var i = $('#p_scents tr td').size() + 1;
$('#uploadMore').live('click', function() {
$('<tr><td><label for="imageFile">Image:</label> <input type="file" name="imageFile" accept=".jpg,.jpeg,.png,.gif"></td><td><label for="imageCaption">Image Caption:</label> <input type="text" name="imageCaption"></td><td><a href="#" class="removeUpload" width="150px" style="text-align: center">Remove</a></td></tr>').insertBefore( $('#uploadSubmission') );
i++;
return false;
});
$('.removeUpload').live('click', function() {
if( i > 1 ) {
$(this).parents('tr').remove();
i--;
}
return false;
});
});
最后是PHP:
require($_SERVER['DOCUMENT_ROOT'].'/settings/globalVariables.php');
require($_SERVER['DOCUMENT_ROOT'].'/settings/mysqli_connect.php');
$db_name = 'imageUploads';
$tbl_name = 'gallery';
if(!$conn)
{
die('Could not connect: ' . mysqli_error());
}
mysqli_select_db($conn, "$db_name")or die("cannot select DB");
foreach($_FILES['imageFile'] as $file){
$caption = $_POST['imageCaption'];
$uploadDir = 'http://www.example.com/images/'.'gallery/';
$fileName = $_FILES['imageFile']['name'];
$filePath = $uploadDir . $fileName;
if(move_uploaded_file($_FILES["imageFile"]["tmp_name"],$_SERVER['DOCUMENT_ROOT']."/images/gallery/".$_FILES["imageFile"]["name"]))
{
$query_image = "INSERT INTO $tbl_name(filename,path,caption) VALUES ('$fileName','$uploadDir','$caption')";
if(mysqli_query($conn, $query_image))
{
echo "Stored in: " . "gallery/" . $_FILES["imageFile"]["name"];
}
else
{
echo 'File name not stored in database';
}
}
}
我希望通过我的foreach
循环让它适用于多张图片,但即使我选择了4张图片,也只上传了一张图片。
编辑:
我已经尝试将我的代码修改为这个并且它也不起作用,但是看一下教程,这似乎比我以前的代码更加正确:
require($_SERVER['DOCUMENT_ROOT'].'/settings/globalVariables.php');
require($_SERVER['DOCUMENT_ROOT'].'/settings/mysqli_connect.php');
$db_name = 'imageUploads';
$tbl_name = 'gallery';
if(!$conn)
{
die('Could not connect: ' . mysqli_error());
}
mysqli_select_db($conn, "$db_name")or die("cannot select DB");
foreach($_FILES['imageFile'] as $key => $name){
$caption = $_POST['imageCaption'];
$uploadDir = 'http://www.jollyrogerpcs.com/images/'.'gallery/';
$fileName = $key.$_FILES['imageFile']['name'][$key];
$file_size = $_FILES['files']['size'][$key];
$file_tmp = $_FILES['files']['tmp_name'][$key];
$file_type= $_FILES['files']['type'][$key];
$filePath = $uploadDir . $fileName;
if(move_uploaded_file($file_tmp,$_SERVER['DOCUMENT_ROOT']."/images/gallery/".$fileName))
{
$query_image = "INSERT INTO $tbl_name(filename,path,caption) VALUES ('$fileName','$uploadDir','$caption')";
if(mysqli_query($conn, $query_image))
{
echo "Stored in: " . "gallery/" . $_FILES["imageFile"]["name"];
}
else
{
echo 'File name not stored in database';
}
}
}
我还在需要它们的HTML输入元素的名称中添加了[]
。
在frz3993的帮助下,这里是完整的工作代码:
require($_SERVER['DOCUMENT_ROOT'].'/settings/globalVariables.php');
require($_SERVER['DOCUMENT_ROOT'].'/settings/mysqli_connect.php');
$db_name = 'imageUploads';
$tbl_name = 'gallery';
if(!$conn)
{
die('Could not connect: ' . mysqli_error());
}
mysqli_select_db($conn, "$db_name")or die("cannot select DB");
$uploadDir = 'http://www.example.com/images/gallery/';
foreach ($_FILES['imageFile']['name'] as $key => $value) {
if($_FILES['imageFile']['error'][$key] == UPLOAD_ERR_OK){
$caption = $_POST['imageCaption'][$key];
$fileName = $_FILES['imageFile']['name'][$key];
$file_size = $_FILES['imageFile']['size'][$key];
$file_tmp = $_FILES['imageFile']['tmp_name'][$key];
$file_type= $_FILES['imageFile']['type'][$key];
$filePath = $uploadDir.$fileName;
if(move_uploaded_file($file_tmp,$_SERVER['DOCUMENT_ROOT']."/images/gallery/".$fileName))
{
$query_image = "INSERT INTO $tbl_name(filename,path,caption) VALUES ('$fileName','$uploadDir','$caption')";
mysqli_query($conn, $query_image);
}
}
}
答案 0 :(得分:2)
就像我在评论$_FILES['imageFile']
中写的那样,它将包含有关上传文件的一些信息。我将使用四个元素(因为我不记得其中还有其他内容)
array('name' => fileName, 'tmp_name' => temporaryName, 'error' => uploadError, 'size' => theFileSize);
当您在foreach
上使用$_FILES
时,实际上正在循环遍历这四个元素,因此循环中的行正在运行四次。
基本上,您无法上传或发布具有相同名称的输入,因为它将被覆盖。但您可以使用数组作为输入名称。对于您的案例name=imageFile[]
和name=imageCaption[]
。假设您有两个上传image1.jpg
和image2.jpg
,其标题为caption1
和caption2
;
$_FILES['imageFile']
和$_POST['imageCaption']
结构将如下:
$_FILES['imageFile'] = array('name' => array(
0 => 'image1.jpg',
1 => 'image2.jpg'
));
$_POST['imageCaption'][0] = caption1;
$_POST['imageCaption'][1] = caption2;
所以你的foreach循环应该看起来像
$uploadDir = 'http://www.jollyrogerpcs.com/images/gallery/';
foreach ($_FILES['imageFile']['name'] as $key => $value) {
if($_FILES['imageFile']['error'][$key] == UPLOAD_ERR_OK){
$caption = $_POST['imageCaption'][$key];
$fileName = $_FILES['imageFile']['name'][$key];
$file_size = $_FILES['imageFile']['size'][$key];
$file_tmp = $_FILES['imageFile']['tmp_name'][$key];
$file_type= $_FILES['imageFile']['type'][$key];
$filePath = $uploadDir.$fileName;
//your move uploaded file and sql query goes here
}
}
答案 1 :(得分:0)
值得注意的是.size()函数在较新的jQuery版本中消失了(我用3.1.1测试过);你可以使用.length(注意.length不是一个函数,不需要括号)。
同样,在较新版本的jQuery中使用.live并不好,应该更新为.on()
我的固定代码,从jQuery 3.1.1开始,是:
$(function() {
var scntDiv = $('#uploadArea');
var i = $('#p_scents tr td').length + 1;
$(document).on('click', '#uploadMore', function() {
$('<tr><td><label for="imageFile">Image:</label> <input type="file" name="imageFile" accept=".jpg,.jpeg,.png,.gif"></td><td><label for="imageCaption">Image Caption:</label> <input type="text" name="imageCaption"></td><td><a href="#" class="removeUpload" width="150px" style="text-align: center">Remove</a></td></tr>').insertBefore( $('#uploadSubmission') );
i++;
return false;
});
$(document).on('click', '.removeUpload', function() {
if( i > 1 ) {
$(this).parents('tr').remove();
i--;
}
return false;
});
});