仅将第一行粘贴到 Javascript 提示但复制所有行

Question

我正在构建一个 Javascript 呼叫记录器表单。 用户填写一份包含他们通话信息的表格，然后点击“copy”，这将复制一个名为“copyNote”的 div。 该注释将包含多行信息，但注释的第一行始终是主题。 我希望用户能够将文本的第一行粘贴到提示中（作为主题），然后将整个（几行）注释粘贴到用于记录目的的表单中（由公司提供），而不必只复制主题，然后将 go 返回并复制整个注释。

这可以通过使用某种类型的中断字符来指示提示框不要粘贴其他任何内容来完成吗？

使用br标记或\n只会在提示框中添加一个空格。

 function copyToClip(str) { function listener(e) { e.clipboardData.setData("text/html", str); e.clipboardData.setData("text/plain", str); e.preventDefault(); } document.addEventListener("copy", listener); document.execCommand("copy"); document.removeEventListener("copy", listener); }; function CopyToClipboard(element) { var block_level_elements = ['P', 'H1', 'H2', 'H3', 'H4', 'H5', 'H6', 'OL', 'UL', 'DIV', 'FORM', 'HR', 'TABLE']; var newelment = document.createElement("div"); newelment.innerHTML = document.getElementById(element).innerHTML; newelment.style.opacity = 0; document.body.appendChild(newelment); var descendents = newelment.getElementsByTagName('*'); for (var i = 0; i < descendents.length; ++i) { var style = window.getComputedStyle(descendents[i]); var dis = style.getPropertyValue('display'); var tagname = descendents[i].tagName; if (dis.includes("inline") && block_level_elements.includes(tagname)) { var defultcss = document.defaultView.getComputedStyle(descendents[i], "").cssText; descendents[i].outerHTML = descendents[i].outerHTML.replace(new RegExp(tagname, "ig"), "span"); // todo: need to change RegExp to tag name only not inner text descendents[i].style.cssText = defultcss; } } var doc = document; var range, selection; if (doc.body.createTextRange) { range = doc.body.createTextRange(); range.moveToElementText(newelment); range.select(); } else if (window.getSelection) { selection = window.getSelection(); range = doc.createRange(); range.selectNodeContents(newelment); selection.removeAllRanges(); selection.addRange(range); } document.execCommand('copy'); window.getSelection().removeAllRanges(); document.body.removeChild(newelment); document.getElementById("copybtn").innerHTML = "Copied"; }

 .green { display: inline; color: green; white-space: nowrap; }

 <button id='copybtn' onclick="CopyToClipboard('foo')"> Copy the stuff </button> <div id='foo'> This would be the subject<br><br> <b> test </b> me <i> also </i> <div class="green" style="color: green;">Hello world</div>, <h3 class="green" style="color: green;">header3</h3> You can use setData to put TWO COPIES into the same clipboard, one that is plain and one that is rich. That way your users can paste into either a <ul> <li>plain text editor</li> <li>or into a rich text editor</li> </ul> </div>

https://codepen.io/shane8johnson/pen/KKgaZvG

Answer 1

您可以使用 split 来打断句子。

阅读更多关于拆分

 function copyText(){ var node = document.getElementById('note') var htmlContent = node.innerHTML var note = htmlContent.split('.') var noteone = note[0] var notetwo = note[1] document.getElementById("text1").innerHTML = noteone; document.getElementById("text2").innerHTML = notetwo; }

 <div id="note">My name is Jhon. I am 25 Years old, living in india.</div> <button onclick="copyText()">Copy</button> <br> <label>copied text 1:</label> <p id="text1"></p> <label>copied text 2:</label> <p id="text2"></p>