Bootstrap文件输入-如何在初始预览中隐藏拖动按钮？

Question

我正在使用Bootstrap File Input插件来管理用户头像：http://plugins.krajee.com/file-input/

我正在使用以下JS代码初始化插件：

        $("#contact_photo").fileinput({
            showCaption: false, // The "1 file selected non-editable text field"
            showRemove: false, // The "Remove" button
            showUpload: false, // The "Upload" button
            showBrowse: false, // The "Browse ..." button
            browseOnZoneClick: true,

            initialPreview: "{{ lead.contact_photo.url }}",
            initialPreviewConfig: [
                {
                    fileType: 'image',
                    previewAsData: true,
                }
            ],

            removeFromPreviewOnError: true,
            overwriteInitial: true, // Whether to replace the image loaded originally if it exists
            allowedFileExtensions: ['jpg', 'jpeg', 'png'],
            allowedPreviewTypes: ['image'],
            defaultPreviewContent: '<h3>No Contact Photo</h3><h6>Drag or click Browse...</h6>',
            maxFileSize: 10000, // 10 MB
            maxFileCount: 1,
            msgErrorClass: 'alert alert-block alert-danger',
            elErrorContainer: '#kv-avatar-errors-1',
        });

问题是，如果设置了initialPreview键，则初始预览将在左下角包含“拖动”按钮（带有4个方向箭头的图标，对我的设置没有任何作用）。如何删除它？

我尝试在文件输入设置和showDrag: false中都设置initialPreviewConfig，但没有成功。

Answer 1

只需隐藏拖动项：

$("#contact_photo").fileinput({
    ...
    layoutTemplates: {
        actionDrag: '',
    },
});

Answer 2

您可以使用以下方法关闭拖动按钮：

$("#contact_photo").fileinput({
    ...
    fileActionSettings: {
        showDrag: false,
    },
});