在模态对话框之外时,它可以正常工作,但是在引导模态对话框中尝试将文本复制到剪贴板时,它将无法正常工作。

<button class="btn btn-primary-outline" data-toggle="modal" data-target="#dia">Open</button>
<button type="button" class="btn btn-info-outline btn-sm copy" data-clipboard-text="not in modal"><i class="fa fa-clipboard"></i></button>

<div id="test" class="modal fade" id="dia" tabindex="-1" role="dialog" aria-hidden="false">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <form>
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                        <span class="sr-only">Close</span>
                    </button>
                    <h4 class="modal-title">Test</h4>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-info-outline btn-sm copy" data-clipboard-text="in modal">
                        <i class="fa fa-clipboard"></i>
                    </button>
                </div>
            </form>
        </div>
    </div>
</div>

<script>
var clipboard = new Clipboard('.copy',{
            container: document.getElementById('test'),
        });
</script>

这是剪贴板模式(而不是模式)中的示例代码。在尝试将模式对话框中的文本复制到剪贴板时,是否有解决此问题的解决方案?

最佳答案

引用this issue

要么:

bootstrap 3

$.fn.modal.Constructor.prototype.enforceFocus = function() {};

bootstrap 4
$.fn.modal.Constructor.prototype._enforceFocus = function() {};

09-17 15:11
查看更多