我在网站上的深色背景上有白色文本。当访问者复制此文本并将其粘贴到可识别 HTML 的文字处理器(如电子邮件应用程序)中时,文本将复制为白底白字。我已经适应了 this solution通过 c.bavota 更改文本及其背景的颜色,应用 an IE9+ friendly change由金刚蛙推荐。您可以在此 JSBin 中看到效果演示,您可以在下面找到完整的脚本。
这适用于 Mac 上的 Chrome、Safari 和 Opera,但不适用于最新的 Firefox (38.0.1)。我还没有在任何版本的 Internet Explorer 上测试过。
使用 Firefox,如果您粘贴到忽略样式的某个位置(例如电子邮件应用程序的地址栏),则文本将被粘贴,因此至少会复制某些内容。
你能提出一些改变,说服 Firefox 也让这个工作吗?
编辑:在 Firefox 上什么都不做。 Firefox 已经为您完成了这一切,而且做得更好。解决方案是在 Firefox 上禁用此脚本,一切都会好起来的。
<!DOCTYPE html>
<html>
<head>
<style>
html, body{
height: 100%;
margin: 0;
color: #fff;
font-size: 32px;
background: #000;
}
div {
height: 100%;
}
span::selection {
color: #000;
background: #FFF;
}
span::-moz-selection {
color: #000;
background: #FFF;
}
.copy {
color: #000;
background: #FFF;
}
</style>
</head>
<body>
<div>
<p>
<span>Select, then copy and paste this text </span>
into an HTML aware word processor.
</p>
</div>
<script>
function blackOnWhite() {
if (/mozilla/.test(navigator.userAgent.toLowerCase()) && !/webkit/.test(navigator.userAgent.toLowerCase()) {
return;
}
var body = document.getElementsByTagName('body')[0];
var selection = window.getSelection();
var more = "<br /><br />More text"; // change this
var copyDiv = document.createElement('div');
copyDiv.style.position='absolute';
copyDiv.style.left='-99999px';
body.appendChild(copyDiv);
copyDiv.innerHTML = selection + more;
copyDiv.classList.add("copy");
selection.selectAllChildren(copyDiv);
window.setTimeout(function() {
body.removeChild(copyDiv);
},1);
}
document.body.oncopy = blackOnWhite;
</script>
</body>
</html>
最佳答案
在 Mac 上,您可以使用 ⇧⌥⌘V 粘贴未格式化的内容。
关于javascript - 更改从 HTML 页面复制到剪贴板的文本颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30465138/