我正在提交一个包含多个文件上传的表单，所有我想要的
根据上传图片的类别区分上传图片
已上传
<form action="upload.php" method="POST">
<table>
<tr>
<td>
<select name="category[]" >
<option value="13">Food</option>
<option value="15">Medicine</option>
</select>
</td>
<td>
<input type="file" multiple name="product_image[]">
</td>
</tr>
<tr>
<td>
<select name="category[]" >
<option value="13">Food</option>
<option value="15">Medicine</option>
</select>
</td>
<td>
<input type="file" multiple name="product_image[]">
</td>
</tr>
<tr>
<td>
<input type="submit" value="submit">
</td>
</tr>
</table>
</form>
选择类别为“food”并在第一行上传一张名为“food.jpg”的图片。 选择类别为“药物”并在第二行上传两张名为“medicine1.jpg 和 medicine2.jpg”的图像，然后 提交我的结果是
Array(
[category] => Array
(
[0] => 13
[1] => 15
)
[product_image] => Array
(
[0] => food.jpg
[1] => medicine1.jpg
[2] => medicine2.jpg
)
)
但我想根据类别值标记图像。如我所愿
[product_image] => Array
(
[13] => food.jpg
[15] => medicine1.jpg
[15] => medicine2.jpg
)
最佳答案
一个可能的解决方案是在提交表单时创建一个隐藏的输入字段，其中包含所选类别 ID 和文件名的串联值。 格式可能如下所示:
'id_selected_category##filename'
然后您可以使用此分隔符(在本例中为##)从 $_POST 数组中检索服务器上的类别和文件名，这样您就知道为该图像选择了哪个类别。
本例中隐藏输入框的名称是:
'category_file'
您的 $_POST 数组将如下所示:
array(3) {
["category"]=>
array(2) {
[0]=>
string(2) "13"
[1]=>
string(2) "13"
}
["product_image"]=>
array(3) {
[0]=>
string(5) "1.jpg"
[1]=>
string(5) "2.jpg"
[2]=>
string(5) "3.jpg"
}
["category_file"]=>
array(3) {
[0]=>
string(9) "13##1.jpg"
[1]=>
string(9) "13##2.jpg"
[2]=>
string(9) "13##3.jpg"
}
}
例如:
<?php
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
if (isset($_POST['category_file'])) {
$categoryFiles = $_POST['category_file'];
foreach($categoryFiles as $categoryFile) {
$categoryAndFile = array_filter(explode("##", $categoryFile));
if (count($categoryAndFile) == 2) {
// Here you can differentiate the uploaded images according to the category which they were uploaded
$category = $categoryAndFile[0];
$file = $categoryAndFile[1];
}
}
}
}
?>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#theForm").submit(function() {
var categories = $('select[name=category\\[\\]]');
$(categories).each(function() {
var category = this;
var imageNames = $(this).parent().next().children('input[type="file"]').prop("files");
$(imageNames).each(function(){
// Concatenate the selected category with the name of the image
var categoryFileName = $(category).val() + '##' + this.name;
// Add the hidden input field
$('<input>').attr({
type: 'hidden',
name: 'category_file[]',
value: categoryFileName
}).appendTo("#theForm");
});
});
});
});
</script>
</head>
<body>
<form id="theForm" action="upload.php" method="POST">
<table>
<tr>
<td>
<select name="category[]" >
<option value="13">Food</option>
<option value="15">Medicine</option>
</select>
</td>
<td>
<input type="file" multiple name="product_image[]">
</td>
</tr>
<tr>
<td>
<select name="category[]" >
<option value="13">Food</option>
<option value="15">Medicine</option>
</select>
</td>
<td>
<input type="file" multiple name="product_image[]">
</td>
</tr>
<tr>
<td>
<input type="submit" value="submit">
</td>
</tr>
</table>
</form>
</body>
</html>
关于javascript - 将类别标记到我的多个上传图像，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/33854202/