使用 MarkItUp 编辑器使 Pagedown 工作

Question

我有一个需要处理用户帖子的 MVC3 站点。我正在尝试使用 MarkItUp 进行文本编辑，因为我喜欢它功能齐全、易于定制的功能。但是，我使用两个 markdown 库进行转换：Pagedown（客户端）和MarkdownSharp（服务器端）。

这是我的编辑视图中的脚本：

<script type="text/javascript" src="@Url.Content("~/scripts/jquery.markitup.js")"></script>
<script type="text/javascript" src="@Url.Content("~/scripts/jquery.markitup.settings.js")"></script>
<script type="text/javascript" src="@Url.Content("~/Scripts/Markdown.Converter.js")"></script>
<script type="text/javascript" src="@Url.Content("~/Scripts/Markdown.Sanitizer.js")"></script>
<script type="text/javascript" >
    $(document).ready(function () {
        var converter = new Markdown.Converter();
        $('.editor').markItUp(markdownSettings);
        $('.markdown').live('keyup', function () {
        var md = $('#comment-editor').val();
        var html = converter.makeHtml(md);
        $('#preview').html(html);
    });
    $('.markdown').live('click', function () {
        var md = $('#comment-editor').val();
        var html = converter.makeHtml(md);
        $('#preview').html(html);
    });
});
</script>

还有 HTML：

@Html.TextArea("html", "enter your text here", new { id = "comment-editor", @class = "editor" })
<div id="preview" class="markdown"></div>

到目前为止一切顺利。问题/我的问题是......当我启动它并开始输入时，一切都很正常，因为我输入时预览正在正确转换，但 Italic 不起作用。无论我使用 _ 表示法还是单 * 表示法，在编辑器中键入或单击...它都不是斜体。

Pagedown 转换器和 MarkItUp 编辑器之间是否存在问题？还是我很菜鸟错过了什么？

为了澄清，这里是预览 DIV 的样子（Firebug）：

<div id="preview" class="markdown">
    <p>stuff you <em>dont</em> see <em>every</em> day.</p>
</div>

请注意，“dont”用_ 字符标记，“every”用* 标记。

Answer 1

Matthew 写的是我的意思。在我看来，这听起来确实像是你只是有一个 CSS 规则，它会阻止斜体样式按照你的意图显示。您的 Markdown 实现没有任何问题！

您可以通过在#preview.markdown 中将<em> 元素样式添加为斜体的适当CSS 规则来解决此问题，而不会影响您网站的其余部分。

顺便说一句，CSS 重置脚本删除样式的原因是：当您依赖浏览器默认设置您的内容的样式时，您可能会倾向于使用标签来获得视觉效果而不是语义目的。通过这样做，当浏览器以不同方式解释这些元素的表示时，您更有可能遇到问题。重置会翻转这一点，并尝试为您提供一致的空白板，您可以在其中编写语义上有效的 HTML，然后使用 CSS 设置您喜欢的样式。您可以在introduction to Eric Meyer's reset 中阅读更多相关信息。