文本框的 Javascript 值到其他 html 标记（td） onclick

Question

我在文本框中有一些价值，下面有按钮。 Onclick 我需要用这个值更新内部（这将是 HTML 标签）我试过了：

javascript：

<script>
function copyfunction() {
    var textarea = document.getElementById('mytextarea');
    var preview = document.getElementById('html_preview');
    preview.innerHTML = textarea.value;
}
</script>

html：

<textarea id=mytextarea name=text>some initial text</textarea>
<button type=button onclick=\"copyfunction();\">Preview</button>

<table><tr>
    <td id=html_preview></td>
</tr></table>

但它什么也没做

编辑：很抱歉离开逃逸\但我在 php 中这样做，所以：

echo "<button type=button onclick=\"copyfunction();\">Preview</button>";

- 它不起作用，但是当我在简单的 html 中执行此操作时，它会：（

EDIT2：我很抱歉你的所有努力，它工作正常，但是我正在实施TinyMCE并且它不适用于这个应用程序:(

Answer 1

对您的代码进行了一些更改，它可以工作。 在onclick=\"copyfunction();\你需要删除\ s

 function copyfunction() { var textarea = document.getElementById('mytextarea'); var preview = document.getElementById('html_preview'); preview.innerHTML = textarea.value; }

 <textarea id=mytextarea name=text>some initial text</textarea> <button type=button onclick= "copyfunction()">Preview</button> <table> <tr> <td id=html_preview></td> </tr> </table>

Answer 2

在 HTML 属性中省略那些 escaping 反斜杠。 此外，您应该将所有属性值放在双引号中。

 function copyfunction() { var textarea = document.getElementById('mytextarea'); var preview = document.getElementById('html_preview'); preview.innerHTML = textarea.value; }

 <textarea id="mytextarea" name="text">some initial text</textarea> <button type="button" onclick="copyfunction();">Preview</button> <table><tr> <td id="html_preview"></td> </tr></table>

Answer 3

一旦 TinyMCE 被初始化并在页面上可见，原始textarea不再可见。 当您初始化 TinyMCE 时，它iframe呈现为内容编辑区域（有效地隐藏textarea ）。

如果要提取内容 TinyMCE，则需要使用 TinyMCE API 来执行此操作。 您可以使用getContent()检索编辑器的当前内容：

https://www.tiny.cloud/docs/api/tinymce/tinymce.editor/#getcontent

例如：

tinymce.activeEditor.getContent(); 

这是一个工作示例，说明如何将相邻 DIV 与 TinyMCE 中的内容同步：

http://fiddle.tinymce.com/HLgaab/5