將文本從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.