javascript - 像 Stackoverflow 这样的直接/实时预览？

Question

我如何喜欢 Stackoverflow，当您在此字段中键入时，它会直接在其下方预览？.. 我不知道这是如何制作的，我真的很喜欢对我的网站做这样的事情。我有一个你编辑的文本区域，然后..？如何？

谢谢

score 3 · Accepted Answer

使用 jquery，在脚本标签的标题中：

    $(document).ready(function(){
        $('#textbox-id').keypress(function(){
          $('#preview-id').html($(this).val());
        }
    });

然后，在您的 html 中：

<textarea id="textbox-id"></textarea>
<div id="preview-id"></div>

编辑

该死的，被打了几秒。此外，wmdeditor 正是它。

score 2 · Accepted Answer

简单，放置一个 div 元素，然后在文本框的 onMouseup 上，您可以让 jquery 事件移动信息

<textarea id="entry" onmouseup="$('#output').html($('#entry').val())"></textarea>
<div id="output"></div>

score 1 · Accepted Answer

使用 jQuery 的keypress事件：

$('#in').keypress(function() {
    $('#out').text($(this).val());
});

score 1 · Accepted Answer

$(document).ready(function(){
    $('#textbox-id').on('keyup', function(){
      $('#preview-id').html($(this).val());
    });
});