研究如何使用Markdown你們可能要花好幾天才能搞定,但是看我的文章或者下載了源碼,你搞定一般在10分鐘之內。我先給各位介紹下它: Markdown 是一種輕量級標記語言,它允許人們使用易讀易寫的純文本格式編寫文檔。Markdown 語言在 2004 由約翰·格魯伯(英語:John Gruber) ...
研究如何使用Markdown你們可能要花好幾天才能搞定,但是看我的文章或者下載了源碼,你搞定一般在10分鐘之內。我先給各位介紹下它:
Markdown 是一種輕量級標記語言,它允許人們使用易讀易寫的純文本格式編寫文檔。Markdown 語言在 2004 由約翰·格魯伯(英語:John Gruber)創建。Markdown 編寫的文檔可以導出 HTML 、Word、圖像、PDF、Epub 等多種格式的文檔。隨著它的越來越流行我們的網站自然不能落後,那麼我來教大家怎麼配置使用吧!
實現效果如圖:
1.首先你要引用markdown相關文件庫(開源項目地址)
<link href="~/Lib/MarkDown/css/editormd.css" rel="stylesheet" /> <link href="~/Lib/MarkDown/css/editormd.preview.css" rel="stylesheet" /> <script src="~/Lib/MarkDown/js/editormd.js"></script>
2.html中添加編輯器(載入數據只需要放在textarea標簽內即可載入到編輯器)
<div id="test-editormd"> <textarea id="articleContent" style="display: none;">@Html.Raw(Model.Context)</textarea> </div>
3.設置初始化(此時暫不教大家上傳圖片,想瞭解請看我後面的博客介紹)
$(function () { testEditor = editormd("test-editormd", { width: "99%", height: 640, syncScrolling: "single", path: "/Lib/MarkDown/lib/", saveHTMLToTextarea: true, emoji: true }); });
4.獲取數據保存
function btnSave() { alert("html數據:" + testEditor.getHTML()); alert("markdown數據:" + testEditor.getMarkdown()); //保存大家根據需要保存文本就好。 }
相關推薦:
1.在Asp.Net Core中配置使用MarkDown富文本編輯器實現圖片上傳和截圖上傳(開源代碼.net core3.0)
開源地址 動動小手,點個推薦吧!
註意:我們機遇屋該項目將長期為大家提供asp.net core各種好用demo,旨在幫助.net開發者提升競爭力和開發速度,建議儘早收藏該模板集合項目。