如果文本已经输入，JavaScript不会复制innerHTML
如果文本已经输入，JavaScript不会复制innerHTML
提问于 2018-10-24 05:21:05
当用户单击一个按钮将文本从div中的一系列段落复制到文本区域输入字段时，我正在运行以下代码。当文本区域为空时，代码将正常工作，并将段落文本粘贴到字段中。如果我再次按下该按钮，它也会重复此功能，将段落文本附加到先前粘贴的文本。
但是，如果我在文本字段中手动键入任何内容，然后单击按钮，它就不起作用。
function copyDiv() {
var x = document.getElementById('post-caption').getElementsByTagName('p');
var i;
var firstDivContent = x[0].innerHTML;
for (i = 1; i < x.length; i++) {
firstDivContent = firstDivContent + x[i].innerHTML;
}
var secondDivContent = document.getElementById('comment');
firstDivContent = firstDivContent + " " + secondDivContent.innerHTML;
secondDivContent.innerHTML = firstDivContent;
}对应的HTML如下：
<div class="entry themeform" id="post-caption">
<p>Paragraph 1</p>
<p>Paragraph 2</p>
</div>
<input name="submit" type="submit" id="submit" class="submit" value="Send Feedback">
<textarea id="comment" name="comment" cols="45" rows="8" aria-required="true"> </textarea></p>
<input name="copy-text" id="copy-text" class="submit copy-text" value="Copy caption text" onClick="copyDiv();">任何帮助都是非常感谢的。
回答 2
Stack Overflow用户
回答已采纳
发布于 2018-10-24 05:52:00
当涉及到获取/设置其内容时，Textareas的行为与div不同。您需要的是$textarea.value，而不是$textarea.innerHTML。请查看此帖子JavaScript get TextArea input via .value or .innerHTML?
function copyDiv() {
var x = document.getElementById('post-caption').getElementsByTagName('p');
var i;
var firstDivContent = x[0].innerHTML;
for (i = 1; i < x.length; i++) {
firstDivContent = firstDivContent + x[i].innerHTML;
}
var secondDivContent = document.getElementById('comment');
var newContent = firstDivContent + " " + secondDivContent.value;
secondDivContent.value = newContent;
}<button onClick="copyDiv()">Copy</button>
<div id="post-caption">
<p>this is the first</p>
<p>this is the second</p>
<p>this is the third</p>
</div>
<textarea id="comment">This is a comment</textarea>
Stack Overflow用户
发布于 2018-10-24 05:41:26
使用value而不是innerHTML访问textarea。
(您也可以使用document.querySelectorAll('#post-caption p');)
const button = document.querySelector('button');
button.addEventListener('click', copyDiv, false);
function copyDiv() {
var x = document.getElementById('post-caption').getElementsByTagName('p');
var i;
var firstDivContent = x[0].innerHTML;
for (i = 1; i < x.length; i++) {
firstDivContent = firstDivContent + x[i].innerHTML;
}
var secondDivContent = document.getElementById('comment');
firstDivContent = firstDivContent + " " + secondDivContent.value;
secondDivContent.value = firstDivContent;
}<div id="post-caption">
<p>Hallo</p>
<p>Test</p>
<p>This</p>
</div>
<textarea id="comment"></textarea>
<button>Click</button>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/52958002
复制相关文章
相似问题