bootstrap-fileinput用例

bootstrap-fileinput 是一个 Bootstrap 插件，用于在 Web 应用程序中呈现和管理文件上传。以下是一个使用 bootstrap-fileinput 的基本用例。

1. 首先，需要引入 bootstrap 和 bootstrap-fileinput 的 CSS 和 JS 文件。

<!-- 引入 Bootstrap 样式和 JS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

<!-- 引入 bootstrap-fileinput 样式和 JS -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-fileinput/4.5.2/css/fileinput.min.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-fileinput/4.5.2/js/fileinput.min.js"></script>

2. 在 HTML 中添加一个文件上传表单。

<form>
  <input id="file-1" type="file" name="file" multiple class="file" data-overwrite-initial="false" data-min-file-count="2">
</form>

3. 使用以下 JavaScript 代码初始化 bootstrap-fileinput。

$(document).ready(function() {
    $("#file-1").fileinput({
        theme: 'fa',
        uploadUrl: '/upload',
        allowedFileExtensions: ['jpg', 'png', 'gif'],
        overwriteInitial: false,
        maxFileSize: 1000,
        maxFilesNum: 10,
        slugCallback: function (filename) {
            return filename.replace('(', '_').replace(']', '_');
        }
    });
});

以上是一个基本的 bootstrap-fileinput 用例，它可以实现简单的文件上传功能。具体细节可以参考官方文档。