Question

点击后如何从我的按钮“复制URL”进行复制？

function cdwUrlsMDBE() {
            var prd = document.getElementById("prd");

            if (prd.checked == true) {
                Swal.fire({
                    type: 'success',
                    html: 'i am a text that should be copy',
                    width: 'auto',
                    confirmButtonText: 'Copy URLs',
                })

谢谢

Answer 1

您可以通过 html 和 Bootstrap 创建按钮，这样就可以通过 onOpen 在按钮上附加处理程序。

类似这样的东西

Swal.fire({
    title: "Copy it!",
    html: 
        '<textarea id="text_to_be_copied" class="swal2-input" readonly>Some text you want to copy</textarea>' +
            '<button type="button" class="btn btn-default" id="btn-copy" style="margin-left:5px">Copy</button>' +
            '<button type="button" class="btn btn-primary swal-confirm" id="btn-ok" style="float:right" disabled>Text have been copied!</button>' +
        '</div>',
    showConfirmButton: false,
    type: "success",
    onOpen: () => {
        $("#btn-copy").click(() => {
            $("#btn-ok").prop('disabled', false);

            $("#text_to_be_copied").select();
            document.execCommand("copy");
        });

        $("#btn-ok").click(() => {
            Swal.close();   
        });
    }
});

通过这种方式，“确认按钮”仅在您使用复制副本后才显示，但是您可以决定仅通过将Swal.close()放在复制按钮的处理程序中来消除该确认按钮。这样，单击“ che复制”按钮后，弹出窗口将关闭。

您可以根据需要选择使用输入标签代替文本区域。

Javascript-从sweetalert2按钮复制确认

2 个答案: