Simditor是tower開源的一款網頁編輯器官方網址:http://simditor.tower.imjavascript
爲了使Simditor編輯文檔時能將圖片自動從前端上傳到qn,須要修改它的uploader.js源碼,修改後的uploader代碼http://git.oschina.net/sunyurepository/javascript/tree/master/src/js的qnuploader.jscss
引入Simditor的css和相關的js(ps:qnuploader是本身改來支持七牛的,非官方的)前端
<link rel="stylesheet" type="text/css" href="/simditor2.1.5/styles/simditor.css"/> <script type="text/javascript" src="../simditor2.1.5/scripts/jquery.min.js"></script> <script type="text/javascript" src="../simditor2.1.5/scripts/module.js"></script> <script type="text/javascript" src="../simditor2.1.5/scripts/hotkeys.js"></script> <script type="text/javascript" src="../simditor2.1.5/scripts/qnuploader.js"></script> <script type="text/javascript" src="../simditor2.1.5/scripts/simditor.js"></script>
使用實例:java
$(function () { //啓用編輯器 var toolbar = ['title', 'bold', 'italic', 'underline', 'strikethrough', 'color', '|', 'ol', 'ul', 'blockquote', 'table', '|', 'link', 'image', 'hr', '|', 'indent', 'outdent']; var editor = new Simditor({ textarea: $("#content"), toolbar: toolbar, imageButton: ['upload', 'external'], toolbarFloat: true, placeholder:'請填寫內容', upload: { url: 'http://up.qiniu.com', //文件上傳的接口地址 qnTokenUrl: '../xxx/getToken',//從服務器獲取token接口地址 fileKey: 'file', //服務器端獲取文件數據的參數名 connectionCount: 3, leaveConfirm: '正在上傳文件,你肯定要離開這個頁面嗎?', fileSize: 2097152 } }); });