设置Cookie后Clipboard API无法更新剪贴板内容问题排查

该问题和Cookie本身没有关联，是两个逻辑分支的执行时序差异导致的：

• navigator.clipboard.writeText() 是异步API，返回Promise实例，剪贴板写入操作不会在调用后立刻完成
• 未设置Cookie时，代码走弹窗提示分支，不会立刻触发页面跳转，浏览器有足够时间完成剪贴板写入，因此功能正常
• 设置Cookie后，调用写入方法后立刻执行window.open()打开新标签，主线程的跳转操作会阻塞/中断未完成的异步剪贴板写入，导致剪贴板内最终保留的是上一次成功写入的内容

将a标签点击事件的回调改为异步函数，等待剪贴板写入完成后再执行后续逻辑即可，修改后的代码如下：

// setCookie、getCookie等工具函数无需修改，仅调整点击事件回调
$(document).on('click', '.pop-top ul li a', async function() {
    var copiedRole = $(this);
    $('#copyText').val(copiedRole.text());
    // 等待剪贴板写入操作完成再执行后续逻辑
    await navigator.clipboard.writeText($('#copyText').val());
    
    var acknowledgeExists = getCookie("acknowledge");

    if(acknowledgeExists == null) {
        $('#copyMessage, .frosted').addClass('show');
    } else {
        window.open('[redacted]', '_blank');
    }
});

如果需要兼容异常场景，可以补充错误捕获逻辑：

await navigator.clipboard.writeText($('#copyText').val()).catch(err => {
    console.error('剪贴板写入失败：', err);
    // 可自行补充失败提示逻辑
});

内容的提问来源于stack exchange，提问作者OMGDrAcula