我有下面的Javascript,可将div的内容复制到剪贴板。
div的内容总是变化的,但是当前结果始终有大约5条空行,每行由结果前的空白组成。我无法更改此设置,因此我希望使用下面的函数来修剪结果前后的所有空白。
我知道
str.trim()
可能是最好的,但是作为javascript新手,我一直在努力将其插入下面。
<script>
function copyToClipboard(element) {
var $temp = $("<textarea>");
var brRegex = /<br\s*[\/]?>/gi;
$("body").append($temp);
$temp.val( $(element).html().replace(brRegex, "\r\n").replace(/<\/?[a-zA-Z]+\/?>/g, '')).select();
document.execCommand("copy");
$temp.remove();
}
有人能帮忙吗?
谢谢!
最佳答案
您的代码段非常适合我。但是,如果要在某处插入修剪,它将在这里:
function copyToClipboard(element) {
var $temp = $("<textarea>");
var brRegex = /<br\s*[\/]?>/gi;
$("body").append($temp);
$temp.val($(element).html().replace(brRegex, "\r\n").replace(/<\/?[a-zA-Z]+\/?>/g, '').trim()).select();
document.execCommand("copy");
$temp.remove();
}
原因是$(element).html()是一个字符串,并且是替换了要替换的东西后要修剪的字符串。
html的完整代码段:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Copy</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script
src="https://code.jquery.com/jquery-1.12.4.min.js"
integrity="sha256-ZosEbRLbNQzLpnKIkEdrPv7lOy9C27hHQ+Xp8a4MxAQ="
crossorigin="anonymous"
></script>
</head>
<body>
<div class="copy" contenteditable="true">HI<br />I am me! <span>I want to kill you!</span></div>
<button class="copy-button">copy</button>
<script>
function copyToClipboard(element) {
var $temp = $("<textarea>");
var brRegex = /<br\s*[\/]?>/gi;
$("body").append($temp);
$temp.val($(element).html().replace(brRegex, "\r\n").replace(/<\/?[a-zA-Z]+\/?>/g, '').trim()).select();
document.execCommand("copy");
$temp.remove();
}
$('.copy-button').on('click', _ => {
copyToClipboard($('.copy'));
console.log("HI");
});
</script>
</body>
</html>