环境:notpad++;

css:style.css,font-awesome.min.css,simditor.min.css;

js:jquery.min.js,module.js,hotkeys.js,simditor.min.js;


Markdown.html

<!Doctype html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<title>Markdown编辑器</title>
	<link rel="stylesheet" href="style.css" type="text/css" media="all" />
	<link rel="stylesheet" href="font-awesome.min.css" media="all" />	
	<script src="jquery.min.js"></script>
</head>
<body>

<link rel="stylesheet" type="text/css" href="simditor.min.css" />
<script type="text/javascript" src="module.js"></script>
<script type="text/javascript" src="hotkeys.js"></script>
<script type="text/javascript" src="simditor.min.js"></script>

<!--  内容  -->
<div class="container main">
	<!-- 加载编辑器的容器 -->
	<div class="note-editor" style="margin: 10px;">
	    <div id="mded"></div>
	    <div style="padding-bottom: 10px;"><input type="button" class="button-green" value="提交"></div>
	</div>
</div>

<script>
//初始化编辑器
var editor = new Simditor({
  textarea: $('#mded'),
  placeholder: '写笔记...',
  upload: false,
  codeLanguages: '',
  toolbar: [  'bold','code','ul','ol'  ]
});

editor.on('valuechanged', function() {
	$(".simditor-popover").hide();
});
$(".button-green").click(function() {
	var post_url =""
	// var tougao_authorblog = $("#tougao_authorblog").val();
	// var tougao_title = $("#tougao_title").val();
	var tougao_content = editor.getValue();
	if(!tougao_content) {
		alert("请输入内容!");
	} else if(tougao_content.length<100) {
		console.log("tougao_content.length", tougao_content.length);
		alert("内容太短了!");
	} else {
		//console.log("tougao_content.length", tougao_content.length);
		tougao_content = tougao_content.replace(/<pre><code>/,"<pre>");
		tougao_content = tougao_content.replace(/<\/code><\/pre>/,"</pre>");
		//console.log("tougao_content.length", tougao_content.length);
		 // $.post(post_url,{tougao_form:'send',tougao_title:tougao_title,tougao_content:tougao_content}
		$.post(post_url,{tougao_form:'send',tougao_title:tougao_title,tougao_content:tougao_content},function(result){
	       alert(result.msg);
	    },'json');
	}

})
</script>

</body>
</html>

更多推荐

菜鸟教程投稿页面的Markdown编辑器—可插入程序代码