Codemirror中的實時預覽忽略格式化

我在Codemirror中存在實時預覽模式不適用於Markdown的問題。我基本上只是試圖達到與SO相同的效果。因爲它代表了HTML的實時預覽，而不是Markdown。我跟着幾個演示，嘗試了一些沒有運氣的事情，我在這裏作爲最後的手段。下面是相關代碼：Codemirror中的實時預覽忽略格式化

在我的文檔的頭，我裝：

<script src="editor/lib/codemirror.js"></script> 
<link rel="stylesheet" href="editor/lib/codemirror.css"> 
<script src="editor/lib/util/overlay.js"></script> 
<script src="editor/mode/markdown/markdown.js"></script>

注：我有一個名爲editor文件夾中的文件Codemirror。這是我完成的正常設置的唯一真實偏差。

然後在我的文檔<body>我有一個<form>與2個元素：

<textarea id="content" name="content"></textarea> 在我運行下面的JavaScript我的頁面底部 <iframe id="preview"></iframe>

然後（我也使用jQuery 1.8.2）：

// Initialize the editor when document finishes loading 
    jQuery(document).ready(function() { 
     var delay; 
    var editor = CodeMirror.fromTextArea(document.getElementById("content"), { 
     lineNumbers: false, 
     mode: 'markdown', 
     matchBrackets: false, 
     theme: "ambiance", 
     onChange: function() { 
      clearTimeout(delay); 
      delay = setTimeout(updatePreview, 300); 
     } 
     }); 




    // Initialize the live-preview mode 
    function updatePreview() { 
     var previewFrame = document.getElementById('preview'); 
     var preview = previewFrame.contentDocument || previewFrame.contentWindow.document; 
     preview.open(); 
     preview.write(editor.getValue()); 
     preview.close(); 
     } 
     setTimeout(updatePreview, 300); 
    });

我搞不清楚我在做什麼錯了。我試着用XML加載覆蓋模式無濟於事。我在這裏發現了2個帖子，但它們並不完全相關，代碼對我無效。實時預覽顯示和更新，但問題是我只得到一串沒有格式的文本。

因此，舉例來說，下面的降價：＃標題1

A paragraph with __bold__ *text*. 

And [a link](http://example.com)

將輸出這在實時預覽IFRAME正是我在這裏輸入：

# Heading 1 A paragraph with __bold__ *text*.And [a link](http://example.com)

一點也沒有不要將下劃線或星號變爲粗體或斜體文本，並完全忽略換行符。

任何關於發生了什麼問題的想法？我甚至無法修改演示以使其運行。我一定會錯過一些知識。

來源

2012-11-08 Bill

瀏覽器不顯示markdown，它們顯示HTML。您必須添加一個步驟，使用例如https://github.com/chjj/marked將它們轉換爲HTML。

來源

2012-11-09 07:28:07 Marijn

我有一種感覺，我可能需要這樣做，但這是否適用，即使我使用Codemirror？ Codemirror有一個巨大的，有時是脆弱的代碼基地，我只是想確定我做錯了，然後再添加一個步驟。 – Bill

Codemirror中的實時預覽忽略格式化

回答

相關問題