Question

有一项选择多个图像的规定，其中使用<input>标签在同一“名称”下选择多个图像。我需要通过JQUERY AJAX将这些图像文件发送到服务器，并且需要在服务器端访问它们。我该如何实现？

HTML代码

<div class="row col-md-5">
 <input type="file" name="event_files[]" id="event_files" multiple>
 <div style="color:red;"> Hold Ctrl(Control) button to select multiple images</div>
</div>

jquery代码

var media_content = $('#media_content').val();
var subject = $('#subject').val();
var event_files = $("input[name='event_files[]']").map(function(){return $(this).val();}).get();
media_content = media_content + hidden_event_files;

$.ajax({
    type: "POST",
    data: {subject:subject,media_contacts: media_contacts,event_files:event_files, 
           media_content: media_content, _token: '<?php echo csrf_token() ?>'},
    url: base_url('/calendarEvents/send-event-email'),
    success: function (result) {
           $('#send_media_email').removeAttr('disabled');
           $('#send_media_email').html("Send Email");
           $('#send_media_email_modal').modal('hide');
           location.reload();
     }
});

Answer 1

这是您可以访问的ajax，html和php全局文件。希望它对您有用。

   // Updated part
   jQuery.each(jQuery('#event_files')[0].files, function(i, file) {
       data.append('file-'+i, file);
   });

// Full Ajax request
$(".update").click(function(e) {
    // Stops the form from reloading
    e.preventDefault();

        $.ajax({
        url: '/calendarEvents/send-event-email',
        type: 'POST',
        contentType:false,
        processData: false,
        data: function(){
            var data = new FormData();
            jQuery.each(jQuery('#event_files')[0].files, function(i, file) {
                data.append('file-'+i, file);
            });
            data.append('subject' , subject);
            data.append('media_contacts' , media_contacts);
            data.append('media_content' , media_content);
            data.append('_token' , '<?php echo csrf_token() ?>');
            return data;
        }(),
            success: function(result) {
                //alert(result);
                $('#send_media_email').removeAttr('disabled');
                $('#send_media_email').html("Send Email");
                $('#send_media_email_modal').modal('hide');
                location.reload();
            },
        error: function(xhr, result, errorThrown){
            alert('Request failed.');
        }
        });

});

如何从AJAX发送多个图像文件，以及如何在PHP中访问每个图像文件

1 个答案: