将文本框的Javascript值转化为其他html标签(td)的onclick。

Question

我在文本框里有一些值，下面有按钮，点击后我需要用这个值更新里面的内容（将是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>

但它没有任何作用

EDIT: Sorry for leaving escapes / but im doing this in php, so:

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

- 但是当我在简单的html中做的时候，它就可以了:()

EDIT2: 很抱歉你所有的努力，它工作得很好，但是我正在实施 TinyMCE 它不工作与这个应用程序:(

Answer 1

一旦TinyMCE被初始化，并在页面上可见的原始的。textarea 不再可见。 当你启动TinyMCE的时候，它将渲染一个 iframe 作为内容编辑区域（有效地隐藏了 textarea).

如果你想提取TinyMCE的内容，你需要使用TinyMCE的API来实现。 你可以使用 getContent() 检索当前编辑器的内容。

https:/www.tiny.clouddocsapitinymcetinymce.editor#getcontent

比如说，你可以在TinyMCE中同步邻近的DIV。

tinymce.activeEditor.getContent(); 

下面是一个工作实例，说明如何在TinyMCE中同步邻近的DIV的内容。

http:/fiddle.tinymce.comHLgaab5

Answer 2

对你的代码做了一些修改，它的工作。在 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 3

在你的HTML属性中，不要使用反斜杠，而且你应该把所有的属性值用双引号来表示。

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>