JQuery+ajax实现批量上传图片

你可以使用jQuery和Ajax来实现批量上传图片。以下是一个简单的示例代码：

HTML部分：

<input type="file" id="fileInput" multiple>
<button id="uploadBtn">上传</button>
<div id="preview"></div>

JavaScript部分：

$(document).ready(function() {
  // 当选择文件发生改变时
  $('#fileInput').on('change', function() {
    var files = $(this)[0].files;
    for (var i = 0; i < files.length; i++) {
      var reader = new FileReader();
      reader.onload = function(e) {
        // 在预览区域显示图片
        $('#preview').append('<img src="' + e.target.result + '">');
      }
      reader.readAsDataURL(files[i]);
    }
  });

  // 点击上传按钮时
  $('#uploadBtn').on('click', function() {
    var files = $('#fileInput')[0].files;
    var formData = new FormData();
    for (var i = 0; i < files.length; i++) {
      formData.append('images[]', files[i]);
    }
    
    // 发送Ajax请求上传图片
    $.ajax({
      url: 'upload.php',  // 替换为你的上传处理脚本地址
      type: 'POST',
      data: formData,
      processData: false,
      contentType: false,
      success: function(response) {
        // 处理上传成功后的逻辑
        console.log(response);
      },
      error: function(xhr, status, error) {
        // 处理上传失败后的逻辑
        console.log(xhr.responseText);
      }
    });
  });
});

请注意，上述代码中的上传处理脚本地址应替换为你自己的服务器端脚本地址。服务器端脚本可以接收上传的图片文件，并进行相应的处理，如保存到服务器或存储到数据库等。

这是一个基本的示例，你可以根据自己的需求进行扩展和修改。希望对你有帮助！如果还有其他问题，请随时提问。