如何在使用Javascript从网站复制文本时包含文本格式

时间:2015-11-02 08:49:31

标签: javascript

我使用以下JS代码在从网站复制文本时向剪贴板添加额外信息[LINK]:

        $(document).on('copy', function(e)
        {
            var sel = window.getSelection();
            if(typeof short_url =='undefined'){
                if(window.location.hash=="")
                {
                    var url=document.location.href.split('#')[0];
                }
                else
                {
                    var url=document.location.href;
                }
            }else{
                var url=short_url;
            }

            var copyFooter = "<br /><br /><a href='" + url + "'>" + url + "</a>";
            var copyHolder = $('<div>', {html: sel+copyFooter, style: {position: 'absolute', left: '-99999px'}});
            $('body').append(copyHolder);
            sel.selectAllChildren( copyHolder[0] );
            window.setTimeout(function() {
                copyHolder.remove();
            },0);
        });

问题在于,文本不会以确切的格式复制(返回运输和换行符)。而是将所有文本复制为单行文本。

预期结果 enter image description here

实际结果 enter image description here

如何解决问题?

2 个答案:

答案 0 :(得分:0)

可能与Problem detecting Newlines in JavaScript Range Object

重复

如果文本包含在可编辑的div中,请尝试使用sel.toString();如果它包含在不可编辑的div中,请尝试使用getRangeAt(0)和toString()。

答案 1 :(得分:0)

使用此代码段我可以解决问题:

function getSelectionHtml() {
var html = "";
if (typeof window.getSelection != "undefined") {
    var sel = window.getSelection();
    if (sel.rangeCount) {
        var container = document.createElement("div");
        for (var i = 0, len = sel.rangeCount; i < len; ++i) {
            container.appendChild(sel.getRangeAt(i).cloneContents());
        }
        html = container.innerHTML;
    }
} else if (typeof document.selection != "undefined") {
    if (document.selection.type == "Text") {
        html = document.selection.createRange().htmlText;
    }
}
return html;
}
$(document).on('copy', function(e)
{
   var sel = window.getSelection();
   var copyFooter = "<br /><br /><a href='" + document.location.href + "'>" + document.location.href + "</a><br />";
   var copyHolder = $('<div>', {html: getSelectionHtml()+copyFooter, style: {position: 'absolute', left: '-99999px'}});
   $('body').append(copyHolder);
   sel.selectAllChildren( copyHolder[0] );
   window.setTimeout(function() {
      copyHolder.remove();
   },0);
});