给Typecho博客添加JavaScript代码实现复制带版权信息的功能,当访客有意复制文章内容,会在剪切板上增加知乎体一般的版权信息(。・`ω´・)

 title=

代码如下

<script>
document.body.addEventListener('copy', function (e) {
    if (window.getSelection().toString() && window.getSelection().toString().length > 42) {
        setClipboardText(e);
        // alert('商业转载请联系作者获得授权,非商业转载请注明出处哦~\n谢谢合作~(。・`ω´・)');
    }
}); 
function setClipboardText(event) {
    var clipboardData = event.clipboardData || window.clipboardData;
    if (clipboardData) {
        event.preventDefault();
        var htmlData = ''
            + '著作权归作者所有。<br>'
            + '商业转载请联系作者获得授权,非商业转载请注明出处。<br>'
            + '作者:<?php $this->author() ?><br>'
            + '链接:' + window.location.href + '<br>'
            + '来源:<?php $this->options->siteUrl(); ?><br><br>'
            + window.getSelection().toString();
        var textData = ''
            + '著作权归作者所有。\n'
            + '商业转载请联系作者获得授权,非商业转载请注明出处。\n'
            + '作者:<?php $this->author() ?>\n'
            + '链接:' + window.location.href + '\n'
            + '来源:<?php $this->options->siteUrl(); ?>\n\n'
            + window.getSelection().toString();
 
        clipboardData.setData('text/html', htmlData);
        clipboardData.setData('text/plain',textData);
    }
}
</script>

食用方法

你可以直接放在你的主题文件夹下的footer.php最后的一堆 script 之间就可以啦~当然如果考虑到用户体验的话建议只放在post.php文件即文章内页php文件

P.S.有一个弹窗功能觉得比较影响用户体验,所以马赛克掉了。想使用的话把注释符去掉就好了。

参考资料:

MDN
https://qqdie.com/archives/copyright-dog-fading-imitation-zhihu-copy-text-bring-their-own-copyright-statement.html


相关推荐

  1. Typecho 启用 Service Workers 浏览器缓存加速首屏访问
  2. Fontmin:简单易用的字体压缩方案!
  3. TpCache:为 Typecho 配置 Redis 缓存加速(支持密码登录)
  4. typecho获取所有标签制作标签云页面
  5. Typecho主题Handsome自定义添加表情包
  6. typecho 模板 Handsome 主题美化教程
文章作者:喵斯基部落
原文地址:https://www.moewah.com/archives/93.html
版权声明:本博客所有文章除特别声明外,均采用 CC BY-NC-SA 4.0 许可协议。非商业转载及引用请注明出处(作者、原文链接),商业转载请联系作者获得授权。