我在自己的网站上尝试使用MathJax时看到了this question。唯一的答案是建议使用名为python-markdown-math
的扩展名。但是,他们document对我来说不是很全面。此外,似乎python-markdown-math
在服务器端进行渲染,而我想要客户端渲染。
我的问题是:如何,完全,使用Flask-PageDown迁移MathJax?通过“迁移”,我的意思是在Flask-PageDown的预览字段中通过Mathjax即时渲染表示法。 This是一个显示我想要的内容的示例。
这是我尝试过的(fiddle version):
f = function() {
if (typeof flask_pagedown_converter === "undefined")
flask_pagedown_converter = Markdown.getSanitizingConverter().makeHtml;
var textarea = document.getElementById("flask-pagedown-body");
var preview = document.getElementById("flask-pagedown-body-preview");
textarea.onkeyup = function() {
preview.innerHTML = flask_pagedown_converter(textarea.value);
}
textarea.onkeyup.call(textarea);
}
if (document.readyState === 'complete')
f();
else if (window.addEventListener)
window.addEventListener("load", f, false);
else if (window.attachEvent)
window.attachEvent("onload", f);
else
f();
var textarea = document.getElementById("flask-pagedown-body");
function update_mathjax() {
var head = document.getElementsByTagName("head")[0],
script;
script = document.createElement("script");
script.type = "text/x-mathjax-config";
script[(window.opera ? "innerHTML" : "text")] =
"MathJax.Hub.Config({\n" +
" tex2jax: { inlineMath: [['$','$'], ['\\\\(','\\\\)']] }\n" +
"});";
head.appendChild(script);
script = document.createElement("script");
script.type = "text/javascript";
script.src = "http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML";
head.appendChild(script);
};
textarea.addEventListener("onkeyup", update_mathjax, false);
<head>
<title>
Test
</title>
<!-- Bootstrap -->
<link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div class="flask-pagedown">
<textarea class="form-control flask-pagedown-input" id="flask-pagedown-body" name="body" required></textarea>
</div>
<div class="flask-pagedown-preview" id="flask-pagedown-body-preview"></div>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/pagedown/1.0/Markdown.Converter.min.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/pagedown/1.0/Markdown.Sanitizer.min.js"></script>
</body>