点击复制当日日期到剪贴板功能失效问题求助

你的代码存在几个关键问题导致功能失效：

• 复制的字符串用双引号包裹模板语法，无法解析日期对象，且未调用自定义的日期格式化方法
• 每次点击按钮都会重复给Date原型添加toShortFormat方法，属于冗余操作
• 日期处理时错误地将日期值减1，导致复制的日期比实际少一天
• 使用了已废弃的document.execCommand('copy') API，兼容性和可靠性不足

修正后的代码 #

<a href="javascript:copydateToClipboard()">Date</a>
<script>
// 把日期格式化方法放到全局，避免重复定义
Date.prototype.toShortFormat = function() {
    const monthNames = ["January", "February", "March", "April",
                        "May", "June", "July", "August",
                        "September", "October", "November", "December"];
    const day = this.getDate(); // 移除不必要的减1操作
    const monthIndex = this.getMonth();
    const monthName = monthNames[monthIndex];
    const year = this.getFullYear();
    return `${year}_${monthName}_${day}`;
}

function copydateToClipboard() {
    let today = new Date();
    // 使用反引号解析模板字符串，并调用格式化方法
    const str = `${today.toShortFormat()}`;
    
    // 使用现代Clipboard API替代废弃方法
    navigator.clipboard.writeText(str)
        .then(() => {
            console.log("日期已复制到剪贴板");
        })
        .catch(err => {
            console.error("复制失败:", err);
        });
}
</script>

修改说明 #

1. 调整方法定义位置：将toShortFormat方法移到copydateToClipboard函数外部，避免每次点击重复挂载原型方法
2. 修复日期计算错误：移除getDate()后的减1操作，确保日期与实际一致
3. 正确解析模板字符串：使用反引号包裹模板语法，并调用toShortFormat()获取格式化后的日期字符串
4. 替换为现代API：使用navigator.clipboard.writeText()替代废弃的document.execCommand('copy')，提升兼容性和稳定性

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