微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

在 Bootsrap 5 工具提示上复制到剪贴板

如何解决在 Bootsrap 5 工具提示上复制到剪贴板

嗨,我一直在寻找我的代码中的修复程序。我有flask网站,我想在用户按下复制时进行用户交互。当按钮悬停时,它会显示“复制到剪贴板”,但是当我按下按钮时,工具提示中的文本不会改变。这是我的代码

{% block content %}
<div class="container" style="width: 800px; margin: auto">
    <h1 class="display-5">Binary to Decimal</h1>
    <form action="#" method="POST">
    <div class="bd-clipboard">
        <div class="row gx-5">
            <div class="col">
                <div class="p-3 bg-light" id="copy">{{ decimal }}
                    <div class="d-grid gap-2 d-md-flex justify-content-md-end">
                        <button class="btn btn-outline-primary btn-sm" type="button" data-clipboard-target=#copy data-bs-toggle="tooltip" data-bs-placement="top" title="copy to clipboard">copy</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
{% endblock %}

<script type="text/javascript">
    $("button").tooltip('hide')
        .attr('data-original-title','copied!')
        .tooltip('copy to clipboard')
        .tooltip('show');
</script>

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。