删除复制+粘贴的富文本格式?(跨浏览器)

Removing rich text formatting for copy + paste? (Cross Browser)

本文关键字:格式 浏览器 文本 复制 删除      更新时间:2023-09-26

我不确定Javascript或CSS修复是否可以在我的网站上解决这个问题。这似乎只发生在Chrome上(不确定IE是否如此)。

每当用户从我的AspDotNetStorefront站点复制文本并将其粘贴到Word文档时,粘贴的文本包含灰色背景。我可以在我的网站上做些什么来防止这种富文本格式粘贴到文档上?

我不确定是什么原因造成的,除了微软Word的默认粘贴设置。

.unselectable{
   position:absolute;
   z-index:1;
   color:green;
   -webkit-user-select:none;
}
.selectable{
   position:absolute;
   z-index:2;
   color:rgba(0,0,0,0);
   -webkit-user-select:text;
}
<p class="unselectable">Lorem</p>
<p class="selectable">Lorem</p>

您可以截取复制事件,获得没有样式的选择,并将其放入剪贴板。

document.addEventListener('copy', function(e) {
  const text_only = document.getSelection().toString();
  const clipdata = e.clipboardData || window.clipboardData;  
  clipdata.setData('text/plain', text_only);
  clipdata.setData('text/html', text_only);
  e.preventDefault();
});

您可以使用剪贴库https://github.com/mojombo/clippy添加一个复制到剪贴板按钮。这可以帮助删除格式

如果你不想使用Flash,你可以尝试这样做,使它很容易复制文本而不需要格式化:

CSS:

#box {background-color:gray; color:white;width:200px;height:400px;align:center;margin-left:50px;padding:30px}
#copy {position:fixed;top:15px;left:200px;text-decoration:underline}
HTML:

<div id="box">
    <div id="copy" onclick="selectable('p')">Click to select text</div>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla lacinia eros et justo pulvinar pulvinar. Pellentesque nec nisl feugiat, cursus lorem sed, venenatis sem. Curabitur vitae commodo ante, a pellentesque ligula. Morbi sit amet tincidunt ipsum. Fusce rutrum massa at velit dignissim accumsan. Donec hendrerit lorem sed leo viverra, vel cursus sapien lobortis. Praesent quis ligula non justo rhoncus placerat eu non leo. Pellentesque vitae congue enim. Quisque eget turp</p></div> 
JavaScript:

selectable=function(selector){
    var $elem=$(selector);
    innerHTML=$(selector).html()  ;
    $elem.hide();
    $elem.parent().append($('<textarea />').val(innerHTML).css({height:'400px'}));
    $('textarea').select();
};

代码并不漂亮,它只是为了演示概念。

JSFIDDLE: http://jsfiddle.net/rXG2G/

你的问题与javascript, html或css无关。

在Word中粘贴文本默认保持格式化。要在不格式化的情况下粘贴,用户需要右键单击Word文档并执行Paste Special... .