使用javascript实时预览文本_Javascript

使用javascript实时预览文本

javascript

使用javascript实时预览文本,javascript,Javascript,我创建了一个实时预览，无论我在文本区域或文本框中键入什么，预览都可以正常工作 HTML 问题是我打字的时候 ``` </html><p>some text</p></html>``` ``一些文本``` 然后它将显示输出 ```<html>some text</html>``` ``一些文本``` 标记在live preview中被视为段落，但'`不被视为code标记我想要的：我想要当我键入*时，星号将转换为标记或

我创建了一个实时预览，无论我在文本区域或文本框中键入什么，预览都可以正常工作

HTML

问题是我打字的时候

``` </html><p>some text</p></html>```

``一些文本```

然后它将显示输出

```<html>some text</html>```

``一些文本```

标记在live preview中被视为段落，但

'`

不被视为

code

标记

我想要的：我想要当我键入

时，星号将转换为

标记或

，与代码标记相同

使用css将p点作为代码

在野外有很多降价模块（谷歌是你最好的朋友）：

下面是一个使用markdown it（）的示例：

试试这个字符串-

`
`*强调*和**粗体**

不要忘记添加脚本标记：

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/markdown-it/4.4.0/markdown-it.min.js"></script>

我可以解决这个问题，但如果人们只是用手机回答您需要一个标记解析器，然后写入元素的innerHTML属性，那么这就太有帮助了。然后继续编写您需要的程序@MSZ您应该用函数解析（和转换）文本的结果替换

$（this）.val（）

。参考前面的注释。看起来您希望浏览器在keyup上动态呈现标记。不幸的是，Markdown是一种轻量级标记语言，在浏览器或HTML/CSS中没有直接使用@Ori Drori提供了帮助您正确完成此任务的解决方案。@Ori Drori感谢您提供的解决方案。

```<html>some text</html>```

p{
background-color:grey;
padding:10px 3px;  
 }

$(document).ready(function () {
    var md = window.markdownit(); // get a markdown instance

    $('#desc').keyup(function () {
        var html = md.render($(this).val()); // parse the markdown into html
        $('#live-preview').html(html);
    });
});

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/markdown-it/4.4.0/markdown-it.min.js"></script>