使用Ajax和PHP在CodeIgniter中上传多个图像文件

原创

沧州虎王科技 2024-09-02 11:43:24 ©著作权

©著作权归作者所有：来自51CTO博客作者沧州虎王科技的原创作品，请联系作者获取转载授权，否则将追究法律责任

在 CodeIgniter 中使用 Ajax 和 PHP 上传多个图像文件，可以按照以下步骤进行操作：

创建一个 HTML 表单，用于选择要上传的多个图像文件。在表单中添加一个文件输入字段，并设置 multiple 属性，以允许选择多个文件。

<form action="upload.php" method="post" enctype="multipart/form-data">
  <input type="file" name="images[]" multiple>
  <input type="submit" value="上传">
</form>

在 PHP 脚本中，使用 $_FILES 数组来获取上传的文件信息。遍历 $_FILES['images'] 数组，对每个文件进行处理。

<?php
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
  // 获取上传的文件信息
  $files = $_FILES['images'];

  // 遍历文件数组
  foreach ($files['name'] as $key => $name) {
    // 获取文件的临时路径
    $tmp_name = $files['tmp_name'][$key];

    // 获取文件的类型
    $type = $files['type'][$key];

    // 获取文件的大小
    $size = $files['size'][$key];

    // 移动文件到指定的目录
    move_uploaded_file($tmp_name, 'uploads/'. $name);
  }
}
?>

在上述 PHP 脚本中，使用 move_uploaded_file 函数将上传的文件移动到指定的目录。你可以根据需要修改 uploads/ 为你实际的上传目录。
在 JavaScript 中，使用 Ajax 发送表单数据到 PHP 脚本。可以使用 XMLHttpRequest 对象或 jQuery 的 ajax 方法来实现。

// 使用 XMLHttpRequest 对象
var xhr = new XMLHttpRequest();
xhr.open('POST', 'upload.php');
xhr.setRequestHeader('Content-Type','multipart/form-data');

var formData = new FormData();
formData.append('images[]', document.getElementById('images').files[0]);

xhr.send(formData);

// 使用 jQuery 的 ajax 方法
$.ajax({
  url: 'upload.php',
  type: 'POST',
  data: new FormData($('#form')[0]),
  processData: false,
  contentType: false,
  success: function(response) {
    // 处理上传成功的响应
  },
  error: function(xhr, status, error) {
    // 处理上传失败的响应
  }
});