H5手机端多文件上传预览插件

H5手机端多文件上传预览插件可以方便地用于网站或应用的图片上传功能。下面是使用该插件的完整攻略：

1. 下载和引入插件文件

该插件可以在Github上下载。下载完成后，将jquery.uploader.js和jquery.uploader.css文件复制到项目中，并在HTML文件中引入这两个文件。

2. 编写HTML代码

在HTML代码中，需要添加一个文件上传控件。该控件主要包括一个上传按钮和一个文件列表。以下是一个示例：

<div class="uploader">
  <div class="uploader-list"></div>
  <div class="uploader-btn">上传图片</div>
  <input type="file" multiple="" class="uploader-input">
</div>

3. 初始化插件

在页面加载完成后，使用jQuery初始化插件。以下是示例代码：

$(function() {
  $('.uploader').uploader();
});

4. 指定文件上传地址

在初始化插件时，可以通过options来指定文件的上传地址和其他参数。以下是示例代码：

$(function() {
  $('.uploader').uploader({
    url: '/upload',
    method: 'POST',
    dataType: 'json',
    paramName: 'file',
    maxFileSize: 10 * 1024 * 1024,
    allowedTypes: 'jpg,jpeg,png,gif'
  });
});

5. 文件上传后的处理

当上传完成后，插件将触发一个文件上传完成的回调函数。在该回调函数中，可以对上传的文件进行处理。以下是一个示例：

$(function() {
  $('.uploader').uploader({
    url: '/upload',
    method: 'POST',
    dataType: 'json',
    paramName: 'file',
    maxFileSize: 10 * 1024 * 1024,
    allowedTypes: 'jpg,jpeg,png,gif',
    onSuccess: function(file, response) {
      console.log('上传成功', file);
      console.log('返回结果', response);
    },
    onError: function(file, message) {
      console.log('上传失败', file);
      console.log('错误信息', message);
    }
  });
});

以上是使用H5手机端多文件上传预览插件的完整攻略。通过上述步骤的操作可以轻松地实现多文件上传功能，并且可以自定义上传地址、文件大小限制等参数，满足不同项目需求。