将文本从textarea追加到div
[英]Append text to div from textarea
问题描述
我正在尝试制作一个简单的编辑器，用户可以在其中输入文本，然后单击编辑按钮，它将把该文本附加到id="textArea" 。 在文本区域中输入文本后，单击编辑按钮没有任何反应。
如果有人能指出我做错了什么或更好的方法来做到这一点，我将不胜感激，我已经看到了其他解决方法，但我不确定为什么这种方法不起作用。 谢谢。
<!DOCTYPE html>
<html>
<head>
<script src="https://d3js.org/d3.v3.min.js"></script>
<script>
function edit(){
var editorText = document.getElementById("editor").value;
$("#textArea")append("editorText");
}
</script>
</head>
<body>
<div>
<form>
Text Editor
<br/>
<textarea id="editor">
</textarea>
<br/>
<input type="submit" value="Edit" onclick="edit()">
</form>
</div>
<br>
<div id="textArea">
<h2><a name="year1"></a>Document</h2>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse laoreet nisl velit, at elementum enim blandit in. Suspendisse sit amet posuere ex. Donec sit amet commodo nibh. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Etiam vitae tincidunt metus. Suspendisse ex ligula, placerat convallis varius in, placerat et ipsum. Pellentesque et neque nec nisl consectetur fringilla ut tristique ligula. Aliquam in sem turpis.
</p>
</div>
</body>
</html>
编辑：在遵循了一些建议之后，我仍然没有运气。 这是我尝试使用的新代码。
<!DOCTYPE html>
<html>
<head>
<script src="https://d3js.org/d3.v3.min.js"></script>
<script>
function edit(){
$("#editor").append("editorText");
}
</script>
</head>
<body>
<div>
<form>
Text Editor
<br/>
<textarea id="editor">
</textarea>
<br/>
<input type="button" value="Edit" onclick="edit()">
</form>
</div>
<br>
<div id="textArea">
<h2><a name="year1"></a>Document</h2>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse laoreet nisl velit, at elementum enim blandit in. Suspendisse sit amet posuere ex. Donec sit amet commodo nibh. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Etiam vitae tincidunt metus. Suspendisse ex ligula, placerat convallis varius in, placerat et ipsum. Pellentesque et neque nec nisl consectetur fringilla ut tristique ligula. Aliquam in sem turpis.
</p>
</div>
</body>
</html>
3 个解决方案
解决方案1
0 2016-04-23 20:04:16
您尝试附加字符串“ editorText”而不是变量，但您错过了一个。
你应该做：
$("#textArea").append(editorText);
解决方案2
0 2016-04-23 20:04:25
如下更改按钮和编辑功能
<input type="button" value="Edit" onclick="edit()">
function edit(){
$("#editor").append("editorText");
}
解决方案3
0 2016-04-24 00:05:04
您不能将textarea的文本内容附加到元素。 而不是这样做，请尝试以下操作：
$('input[type="submit"]').click(function(){
$('#textArea').text($('#editor').val());
});
那就是jQuery。 当您单击提交按钮时，将发生id="textArea"的文本内容就是#editor的文本内容。 如果您想呈现在#editor中键入的#editor例如<p>This is a paragraph</p> html()则可以将text()更改为html() 。
onclick将textarea附加到div
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.