javascript - 如何实时预览基于 Web 的文本编辑器？

Question

好吧，就像这个 Stackoverflow 编辑器一样。此外，如何在加载额外的 js 时做到这一点？（如 math.stackexchange 上的实时数学预览）

明确地说，我现在明确地想要的是如何立即刷新。

现在我能想出的是

show(){
    var text=document.getElementById("preview");
    var input=document.getElementById("inputArea").value;
    text.innerHTML=input;
}
<textarea id="inputArea">fd</textarea>
<p id="preview"></p>
<button onclick="show()">show</button>

但这显然不是实时的。也许可以添加一个计时器并每隔 0.1 秒执行一次“show()”。但我认为这也是不明智的。

是否有任何本机 HTML 或 javascript 方法可以实现此目的？

Answer 1

在这里，看看 Aloha Editor。

http://www.aloha-editor.org/

Answer 2

<script>
function show(v){
    document.getElementById("preview").innerHTML = v;
}
</script>
<textarea id="inputArea" onkeyup="show(this.value)"></textarea>
<p id="preview"></p>

你甚至可以在没有 JS 代码段的情况下做到这一点：

<textarea id="inputArea" onkeyup="document.getElementById('preview').innerHTML=this.value"></textarea>
<p id="preview"></p>