标签: multi-upload

如何使用PHP,jQuery和AJAX上传多个文件

我设计了一个简单的表单,允许用户将文件上传到服务器.最初,表单包含一个"浏览"按钮.如果用户想要上传多个文件,他需要点击"添加更多文件"按钮,在该表单中添加另一个"浏览"按钮.提交表单后,文件上载过程将在"upload.php"文件中处理.它适用于上传多个文件.现在我需要使用jQuery的'.submit()'提交表单,并将'ajax ['.ajax()']请求发送到'upload.php'文件来处理文件上传.

这是我的HTML表单:

<form enctype="multipart/form-data" action="upload.php" method="post">
    <input name="file[]" type="file" />
    <button class="add_more">Add More Files</button>
    <input type="button" id="upload" value="Upload File" />
</form>
Run Code Online (Sandbox Code Playgroud)

这是JavaScript:

$(document).ready(function(){
    $('.add_more').click(function(e){
        e.preventDefault();
        $(this).before("<input name='file[]' type='file' />");
    });
});
Run Code Online (Sandbox Code Playgroud)

以下是处理文件上传的代码:

for($i=0; $i<count($_FILES['file']['name']); $i++){
$target_path = "uploads/";
$ext = explode('.', basename( $_FILES['file']['name'][$i]));
$target_path = $target_path . md5(uniqid()) . "." . $ext[count($ext)-1]; 

if(move_uploaded_file($_FILES['file']['tmp_name'][$i], $target_path)) {
    echo "The file has been uploaded successfully <br />";
} else{
    echo "There was an error uploading the file, please try again! <br />"; …
Run Code Online (Sandbox Code Playgroud)

php ajax jquery multi-upload jquery-file-upload

45
推荐指数
2
解决办法
15万
查看次数

如何在django管理中将多个图像上传与UPLOADIFY集成?

我遇到了django-uploadify(多文件上传)应用程序,但在项目的wiki中描述了唯一的模板用法.我需要将它与django admin集成.有任何想法吗?

django file-upload django-admin uploadify multi-upload

10
推荐指数
1
解决办法
1946
查看次数

在Drupal 7中上传多个文件

图像字段只允许一个文件同时上传.是否有一个模块可以在Drupal 7中启用多重上传?

drupal-7 multi-upload

9
推荐指数
1
解决办法
2万
查看次数

如何从多输入中的FileReader函数中获取文件名?

我有以下代码:

<input type="file" multiple='multiple'>
<div id="thumbs"></div>

<script type="text/javascript">
    $('input[type="file"]').change(function() {
    $('#thumbs').html('');
    $.each(this.files, function() {
    readURL(this);
 })
});

function readURL(file) {
    var reader = new FileReader();
    reader.onload = function(e) {
    $('#thumbs').append('<img src="' + e.target.result + '" width="20%">')
    $('#quantity').text(i)
  }
  reader.readAsDataURL(file);
}
</script>
Run Code Online (Sandbox Code Playgroud)

这是一个多上传输入.当我选择"x"图片时,它会为它们创建缩略图.这完全有效,但我想知道如何获取文件名(如果图片名为"sun.jpg",我想得到"sun"),并将它们附加到图片中.我试过这个:

$('#thumbs').append('<img src="' + e.target.result + '" width="20%"><p>'+e.name+'</p>')
Run Code Online (Sandbox Code Playgroud)

不过e.nameundefined.

这是一切的小提琴:https://jsfiddle.net/ugs6rzqx/1/

任何帮助,将不胜感激.谢谢.

javascript jquery html5 multi-upload

2
推荐指数
1
解决办法
4221
查看次数