前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >Simditor富文本编辑器的调用

Simditor富文本编辑器的调用

作者头像
简单、
发布2018-07-18 15:35:05
1K0
发布2018-07-18 15:35:05
举报

首先,官网下载包。http://simditor.tower.im/

然后载入脚本文件。(我用的是TP框架,所以我直接将它下载好以后,解压到后台模块,public目录下。)

将以下链接放到inc里面。方便多处调用!

代码语言:javascript
复制
<link rel="stylesheet" type="text/css" href="[style path]/styles/simditor.css" />
<script type="text/javascript" src="[script path]/scripts/jquery.min.js"></script>
<script type="text/javascript" src="[script path]/scripts/module.js"></script>
<script type="text/javascript" src="[script path]/scripts/hotkeys.js"></script>
<script type="text/javascript" src="[script path]/scripts/uploader.js"></script>
<script type="text/javascript" src="[script path]/scripts/simditor.js"></script>

前端调用

代码语言:javascript
复制
<textarea id="text" name="text"></textarea>

用js语言

代码语言:javascript
复制
<script>
    var editor = new Simditor({
    textarea: $('#text') //注意这里一定要和id对应一致!不然就会出错,或者不显示!
    placeholder:'请输入正文....',
    //增加其他扩展功能如下
    toolbar:[
     'title',
     'bold',
     'italic',
     'underline',
     'strikethrough',
     'fontScale',
     'color',
     'ol',      
     'ul',
     'blockquote',
     'code', 
     'table',
     'link',
     'image',
     'hr',    
     'indent',
     'outdent',
     'alignment'
    ]
    });
</script>

前端id,name要和script里面的textarea:$(对应)一致。

simditor配置
simditor配置

然后就可以使用啦!

Tags: None

Archives QR Code

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档