为什么将文本复制到剪贴板时未应用换行 [英] Why new line is not applied when copying text to clipboard

问题描述

我之前问过 如何创建一个共享按钮，以与Google博客博客中的帖子URL分享报价并获得解决方案。

现在我是

 < script>试图提供后备功能，因为大多数浏览器不支持Web Share API方法并提出了解决方案。 
 //<！[CDATA [
 var title = document.title; 
 var url = window.location.href; 
 
 document.querySelectorAll（'。shareBtn'）。forEach（function（btn）{
 var text = btn.previousElementSibling.textContent +'\n'; 
 btn。 addEventListener（'click'，function（）{
 if（navigator.share）{
 navigator.share（{
 title：title，
 text：text，
 url：url 
}）; 
} else {
 var shareText = document.createElement（'input'）; 
 document.body.appendChild（shareText）
 shareText .value = text + url; 
 shareText.select（）; 
 document.execCommand（'copy'，false）; 
 shareText.remove（）; 
 alert（ Text复制）; 
} 
}）; 
}）； 
 //]]> 
< / script> 
  

如果部分 var text = btn.previousElementSibling.textContent +'\n'在文本和url之间应用了行距，但在其他情况下未应用部分执行的行距。

解决方案

您需要使用 textarea 元素，而不是 createElement（） <中的输入 / p>

I previously asked "How to make a share button to share quote with post URL in Google blogger blog" and got solution.

Now I am trying to make fall back function because most browser not support Web Share API method and came up with solution.

<script>
//<![CDATA[
var title = document.title;
var url = window.location.href;

document.querySelectorAll('.shareBtn').forEach(function (btn) {
    var text = btn.previousElementSibling.textContent + '\n';
    btn.addEventListener('click', function () {
        if (navigator.share) {
            navigator.share({
                title: title,
                text: text,
                url: url
            });
        }else{
                var shareText = document.createElement('input');
                document.body.appendChild(shareText)
                shareText.value = text+url;
                shareText.select();
                document.execCommand('copy',false);
                shareText.remove();
                alert(" Text Copied");
            }
    });
});
//]]>
</script>

In if part var text = btn.previousElementSibling.textContent + '\n' line gap applied between text and url but when else part executed line gap not applied.

解决方案

You need to use a textarea element instead of an input in createElement()

这篇关于为什么将文本复制到剪贴板时未应用换行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！