响应丰富的编辑器预览
考虑这个例子 。
关键是JavaScript：
function encodeInput(editor) { theText = editor.val(); theText = theText.replace(/\*\*\*(.*?)\*\*\*/, '$1', 'g'); theText = theText.replace(/\*\*(.*?)\*\*/, '$1', 'g'); theText = theText.replace(/\*(.*?)\*/, '$1', 'g'); console.log(theText); $('#preview').html(theText); } $(function() { $editor = $('#editor'); $editor.keyup(function() { encodeInput($(this)); }); }); 测试和工作很好（我需要\*\*\*部分或它不起作用）。
无论如何，在主菜上
问题
因为我正在使用keyup ，所以脚本响应不是很快（例如，只有当用户放开密钥时它才会“运行”）。 我希望它的行为更像StackOverflow上的编辑器，按下键并立即响应。
我尝试使用keydown和keypress但似乎val()属性在运行时没有更新，所以我真的不知道更新的值。
简而言之
如何让它更具响应性，以便当用户按下某个键时，预览会自动更新？
您可以在大多数浏览器中使用HTML5 input事件，在IE <9中使用propertychange事件。这些事件在更新textarea值后立即触发。
这是使用这些事件的更新演示：
我已经在SO的几个地方写过这个。 以下是其中两个：
- 仅捕获改变输入的按键？
- jQuery键盘事件
我建议不要在每次更改textarea值时更新预览，因为它很快就会无法响应，这对于用户体验来说是一个很大的禁忌。 我建议“去抖动”事件，在这种情况下，在更新预览之前等待一段时间的用户不活动（比如说半秒）。 这是一个答案和一个可能有用的链接：
- 如何触发一个延迟的onkeyup事件，直到用户暂停键入？
- John Hann宣布Javascript方法
你可以bind() keyup和keydown事件：
$editor.bind('keyup keydown', function() { encodeInput($(this)); });
我注意到只有第一次出现才有效，将g标志添加到正则表达式似乎有所帮助，并且仅出于jsfiddle演示的目的，取消选中“normalize css”会使粗体文本出现。
当连续按下键时，键盘会触发，因此您必须将其绑定到按键才能看到结果。 就是这样。
更新：我明白你的意思了。 也许你需要一个输入轮询器？ 查看de conffuscated wmd代码。 这将帮助您实现您的目标：
WMD下载