javascript - 删除了引导对话框中空格按钮之间的空格

Question

我正在使用 Bootstrap 3.3.7 和 Bootstrap Confirmation 2.4.1 开发网络应用。确认效果很好，但是当我按下包含确认的按钮(删除)时，它会删除删除和关闭按钮之间的一些空间，如下图所示:

未经确认查看:

弹出确认后查看:

这是带有确认按钮的对话框的代码:

<a href="#divResults" data-toggle="modal" data-target="#divResults" class="btn btn-info btn-lg">
  <span class="glyphicon glyphicon-list-alt"></span> Table
</a>

<div class="modal fade" id="divResults" role="dialog">
    <div class="vertical-alignment-helper">
        <div class="modal-dialog vertical-align-center">
            <div class="modal-content">
                <div class="modal-body">
                    <table class="table">
                        <caption>Meeting at 12/04/2018</caption>
                        <thead>
                            <tr>
                                <th>Member</th>
                                <th>Role</th>
                                <th>Time</th>
                            <tr>
                        </thead>
                        <tbody id="tBodyResults"></tbody>
                    </table>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-success" id="linkDownload"><span class="glyphicon glyphicon-download-alt"></span> <span>Export</span></button>
                    <button id="btnDelete" class="btn btn-danger"
                            data-btn-ok-label="Yes" data-toggle="confirmation"
                            data-btn-ok-class="btn-danger"
                            data-btn-cancel-label="No" data-btn-cancel-class="btn-default"
                            data-title="Are you sure you want to delete this agenda?">
                        <span class="glyphicon glyphicon-trash"></span> <span>Delete</span>
                    </button>
                    <button type="button" class="btn btn-default" data-dismiss="modal"><span class="glyphicon glyphicon-remove"></span> <span>Close</span></button>
                </div>
            </div>
        </div>
    </div>
</div>

确认书标题的自定义 CSS:

.popover-title {
    font-weight: bold;
}

我用来加载确认的 JS:

$(function () {
    $("[data-toggle=confirmation]").confirmation({
        rootSelector: "[data-toggle=confirmation]",
        onConfirm: function () {
        }
    });
});

这是一个带有示例的 Fiddle:

https://jsfiddle.net/fanmixco/o2mre604/16/

我在官方文档中找不到任何关于如何知道何时 Confirmation 的选项。出现/关闭，然后我可以从我这边添加一些 jQuery 代码，例如:

$("#btnDelete").prop("margin-right", "6px");

如果有人知道如何修复，我们将不胜感激。谢谢。

Answer 1

找到解决方案。

您需要将 css 添加为 .btn{margin-left: 5px;}

这是 Fiddle