我有一个包含类型文件输入的表单,可以接受多个文件(图像),如下所示:
<input type="file" id="fileupload" name="fileupload[]" multiple />
一旦用户选择了一个图像或多个图像,它们就会动态添加到网站上,如果他愿意,用户也可以删除其中的一个或全部。
有没有办法可以更新从input元素中选择哪些文件发送到php脚本?
如果不能如何只发送用户选择的图像?我的意思是我可以将用户在JavaScript中选择的内容放在另一个数组中但是如何将它们发送到php脚本?
被修改
更多细节例如,当用户选择三个图像文件时,我使用的JavaScript代码会将它们作为图像附加到屏幕中,并且用户可以选择删除其中的一个或全部点击它们。所以我的问题是,如果用户例如删除了其中一个图像,我怎么才能将其他两个图像发送到php脚本中呢?
我不是在寻找完整的代码。我只想找到如何完成它的提示。
答案 0 :(得分:3)
我已经理解了你想要的东西。
将Ajax与formData结合使用即可。
$(document).ready(function(){
$("form#data").submit(function(){
// create your filtred list of files from your file input
var data = {};
$.each($('#fileupload')[0].files, function(i, file) {
// Keep only the files that the user has selected
if ( i % 2 == 0){ // <--- CHANGE THIS
data['file-'+i] = file;
}
});
// create a FormData (to send files with AJAX)
var formData = new FormData();
for (var key in data) {
formData.append(key, data[key]);
}
// send that formData
php_script_url = "your_script.php"
$.ajax({
url: php_script_url,
type: 'POST',
data: formData,
async: false,
success: function (data) {
console.log(data);
},
cache: false,
contentType: false,
processData: false
});
return false;
});
});
不要忘记在此脚本之前加入jQuery
<script src="//code.jquery.com/jquery-1.12.0.min.js"></script>