javascript - 写入文本时更新 div 无法按预期工作

Question

我的目标是在 textarea 中编写内容并准确显示我正在编写的内容，而不必刷新页面，我键入的每个字母都会立即显示，但由于某种原因无法正常工作。

p>

HTML:

 <textarea id="Q&A" name="txtarea" rows="4" cols="50"></textarea>
 <div id="out"></div>

Js:

function generate() {
  var reader = new commonmark.Parser();
  var writer = new commonmark.HtmlRenderer();
  var parsed = reader.parse(text);
  text = writer.render();
  document.getElementById("out").innerHTML = text
}

document.getElementById("Q&A").addEventListener("input", function () {
    generate(this.value);
});

当我尝试使用 JavaScript 将 ID 为 out 的 div 更新为我输入的内容时，它不起作用。

Answer 1

我不知道 commonmark.Parser() 在您的代码中做了什么。但我看到的问题是，当您调用 generate 方法时，您传递的是输入字段的值。但是在您的生成方法签名中，您没有参数来接受它。

将参数添加到您的 generate() 方法以接受传入的值。

function generate(text) {
   //do something else on text with your commonmark
   document.getElementById("out").innerHTML = text;
}

Here是一个工作样本。

并且您忘记将参数 parsed 传递给渲染函数:

你有:text = writer.render(); 我把它改成了 text = writer.render(parsed);