var converter2 = new Markdown.Converter();
converter2.hooks.chain("postConversion", function (text) {
return text.replace(/<pre>/gi, "<pre class=prettyprint>");
});
var editor2 = new Markdown.Editor(converter2, "-second");
editor2.hooks.chain("onPreviewRefresh", function () {
prettyPrint();
});
editor2.run();
AFAIK, WMD is dead, but PageDown is a fork based on the WMD source.
It's an active project based on the work done in WMD. That takes care of the Markdown editor. To get syntax highlighting working you'll also need to download source from the Google-Code-Prettify project.
Combine the demo.html, demo.css, prettify.js, prettify.css into the same folder.
Note: This assumes that the PageDown source files are in the parent directory.
To enable syntax highlighting, you'll need to do two things:
Add the 'prettyprint' class to all 'code' elements generated by the editor.
Fire the prettyPrint() event after a change is made.
If you take a look at the code, I modified the non-sanitized converter to do both:
var converter2 = new Markdown.Converter();
converter2.hooks.chain("postConversion", function (text) {
return text.replace(/<pre>/gi, "<pre class=prettyprint>");
});
var editor2 = new Markdown.Editor(converter2, "-second");
editor2.hooks.chain("onPreviewRefresh", function () {
prettyPrint();
});
editor2.run();
To give you an idea of the flexibility. Google-Code-Prettify is the same library that enables syntax highlighting on code.google.com and stackoverflow.com.
It took me a little while to figure out how to get it to work but it's amazing how easy it is to implement. This is only a demo example but it shouldn't be too hard to extend it further.
发布评论
评论(3)
看看 PageDown Markdown 编辑器...
AFAIK,WMD 已死,但 PageDown 已死基于 WMD 源的分叉。
这是一个基于 WMD 所做工作的活跃项目。这就是 Markdown 编辑器的作用。要使语法突出显示正常工作,您还需要从 Google-Code-Prettify 下载源代码 项目。
将 demo.html、demo.css、prettify.js、prettify.css 合并到同一文件夹中。
相应地修改导入:
注意:这假设 PageDown 源文件位于父目录中。
要启用语法突出显示,您需要执行两件事:
如果您看一下代码,我修改了未清理的转换器以执行以下两个操作:
为了让您了解灵活性。 Google-Code-Prettify 是在 code.google.com 和 stackoverflow.com 上启用语法突出显示的同一个库。
我花了一些时间才弄清楚如何让它发挥作用,但令人惊讶的是它的实施是多么容易。这只是一个演示示例,但进一步扩展它应该不会太难。
Take a look at the PageDown Markdown editor...
AFAIK, WMD is dead, but PageDown is a fork based on the WMD source.
It's an active project based on the work done in WMD. That takes care of the Markdown editor. To get syntax highlighting working you'll also need to download source from the Google-Code-Prettify project.
Combine the demo.html, demo.css, prettify.js, prettify.css into the same folder.
Modify the imports accordingly:
Note: This assumes that the PageDown source files are in the parent directory.
To enable syntax highlighting, you'll need to do two things:
If you take a look at the code, I modified the non-sanitized converter to do both:
To give you an idea of the flexibility. Google-Code-Prettify is the same library that enables syntax highlighting on code.google.com and stackoverflow.com.
It took me a little while to figure out how to get it to work but it's amazing how easy it is to implement. This is only a demo example but it shouldn't be too hard to extend it further.
借助 jquery 并使用计时器插件,可以通过以下方式完成此操作。
此处描述了上述机制
希望有帮助。
With the help of jquery and using the timer plugin this can be done in the following way.
The mechanism of the above is described here
Hope it helps.
您可能对 Github 上的 Stack Overflow 版本的 WMD 感兴趣。该版本可能具有您正在寻找的功能(但我不确定)。
You may be interested in the Stack Overflow version of WMD on Github. This version may have the feature you're looking for in it (but I'm not certain).