研究如何使用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: ,
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)

2.MarkDown富文本编辑器怎么加载模板文件

开源地址 动动小手,点个推荐吧!

注意:我们机遇屋该项目将长期为大家提供asp.net core各种好用demo,旨在帮助.net开发者提升竞争力和开发速度,建议尽早收藏该模板集合项目

在Asp.Net或.Net Core中配置使用MarkDown富文本编辑器有开源模板代码(代码是.net core3.0版本)的更多相关文章

  1. 在Asp.Net Core中配置使用MarkDown富文本编辑器实现图片上传和截图上传(开源代码.net core3.0)

    我们的富文本编辑器不能没有图片上传尤其是截图上传,下面我来教大家怎么实现MarkDown富文本编辑器截图上传和图片上传. 1.配置编辑器到html页 <div id="test-edi ...

  2. Asp.Net Core中配置使用Kindeditor富文本编辑器实现图片上传和截图上传及文件管理和上传(开源代码.net core3.0)

    KindEditor使用JavaScript编写,可以无缝的于Java..NET.PHP.ASP等程序接合. KindEditor非常适合在CMS.商城.论坛.博客.Wiki.电子邮件等互联网应用上使 ...

  3. vue-cli中如何集成UEditor 富文本编辑器?

    1.根据后台语言下载对应的editor插件版本 地址:https://ueditor.baidu.com/website/download.html 2.将下载好的资源放在/static/uedito ...

  4. EXTJS中整合tinymce的富文本编辑器,添加上传图片功能

    提供部分代码.Ext.create('Ext.window.Window', { id: 'wind', title: 'CRUD窗口', modal: true, height: 800, widt ...

  5. 在 Vue 项目中引入 tinymce 富文本编辑器

    项目中原本使用的富文本编辑器是 wangEditor,这是一个很轻量.简洁编辑器 但是公司的业务升级,想要一个功能更全面的编辑器,我找了好久,目前常见的编辑器有这些: UEditor:百度前端的开源项 ...

  6. 百度Web富文本编辑器ueditor在ASP.NET MVC3项目中的使用说明

    ====================================================================== [百度Web富文本编辑器ueditor在ASP.NET M ...

  7. ASP.NET MVC 中使用 UEditor 富文本编辑器

    在上篇<使用ASP.NET MVC+Entity Framework快速搭建博客系统>中,已经基本上可以实现博客分类和博客文章的CURD.但是,文章编辑界面实在是…… 好吧,咱得搞专业点. ...

  8. ASP.NET网站使用Kindeditor富文本编辑器配置步骤

    1. 下载编辑器 下载 KindEditor 最新版本,下载页面: http://www.kindsoft.net/down.php 2. 部署编辑器 解压 kindeditor-x.x.x.zip ...

  9. TinyMCE(富文本编辑器)在Asp.Net中的使用方法

    TinyMCE(富文本编辑器)在Asp.Net中的使用方法   转至:http://www.cnblogs.com/freeliver54/archive/2013/02/28/2936506.htm ...

随机推荐

  1. typeof 与 instanceof之间的区别

    JS中会使用typeof 和 instanceof来判断一个变量是否为空或者是什么类型的. ES6规范中有7种数据类型,分别是基本类型和引用类型两大类 基本类型(简单类型.原始类型):String.N ...

  2. Python与线性代数基本概念

    在Python中使用Numpy创建向量: x = np.array([1, 2, 3, 4]) 创建3 x 3矩阵 B = np.array([[1, 2],[3, 4],[5, 6]]) Shape ...

  3. 【Python进阶】来谈谈几个常用的内置函数

    匿名函数(lambda表达式) 在Python中,函数可以算的上是“一等公民”了,我们先回顾下函数的优点: 减少代码重复量 模块化代码 但是我们有没有想过,如果我们需要一个函数,比较简短,而且只需要使 ...

  4. 关于云服务器中tomcat配置出现的部分问题以及解决方法

    问题描述:(一)tomcat的8080端口修改为80端口之后不能使用域名直接访问: (二)添加的项目不能通过域名直接访问(服务器端还待解决) 大致配置流程: 1.需要先购买合适的服务器,进行域名备案, ...

  5. Python3 系列之 并行编程

    进程和线程 进程是程序运行的实例.一个进程里面可以包含多个线程,因此同一进程下的多个线程之间可以共享线程内的所有资源,它是操作系统动态运行的基本单元:每一个线程是进程下的一个实例,可以动态调度和独立运 ...

  6. 由于ie浏览器ajax缓存 导致layui table表格重载失败的解决办法

    where: { time:new Date()//增加一个数据接口的额外参数→时间戳 }

  7. linux vscode 编译配置

    linux 环境下,g++和clang都可以作为C++的编译器,我这里选择使用的是clang. 首先是插件选择: (1) C/C++ 微软自带的C/C++插件. (2) C/C++ Clang Com ...

  8. 如果获取ruby的hash的v值?

    最近写ruby,用到hash,通过k去获取v值,有时候通过hash["k"]去获取可以获取到,有时候通过又获取不到,感觉一脸懵逼 仔细观察了下ruby的hash,有两种表现形式,所 ...

  9. Java编程思想——第17章 容器深入研究(一)

    这一章将学习散列机制是如何工作的,以及在使用散列容器时怎么样编写hashCode()和equals()方法. 一.容器分类 先上两张图 来概况完整的容器分类 再细说都为什么会有那些特性. 二.Coll ...

  10. Dubbo学习系列之十一(Dashboard+Nacos规则推送)

    中国武术,门派林立,都是号称多少代的XXX传人,结果在面对现代武术时,经常被KO秒杀,为啥,光靠宣传和口号撑门面,终究是靠不住,必须得有真货 ,得经得住考验,所以不能只说Sentinel有多好,也得给 ...