富文本编辑器

富文本编辑器Redactor在Yii2中的应用

PHPer 2018-01-21 868次浏览 0条评论 0 1 0
网上的内容很不给力,有一些小的使用问题,对于开始用的人,各种搜都找不到好的回答,结果搞的我自己折腾了半天,到最后才发现,之前用的办法,根本没必要用。先上一张图: 界面不错吧,功能更是强大,对富文本的需求基本都能...

网上的内容很不给力,有一些小的使用问题,对于开始用的人,各种搜都找不到好的回答,结果搞的我自己折腾了半天,到最后才发现,之前用的办法,根本没必要用。先上一张图:

8cebbd3f6c-redactor-qq-jie-tu20180121003618.jpg

界面不错吧,功能更是强大,对富文本的需求基本都能满足,对于Yii2版本的,美中不足是不能在参数里设置一些很少用的需求,另外图片上传没看到自动生成缩略图的功能,如果没有的话,只能自己重写些代码。这里附上Github链接:https://github.com/yiidoc/yii2-redactor

话说Redator的工具栏 toolbar,光工具栏就有不少给力的功能:给工具栏设置颜色,

<style type="text/css">
.redactor-toolbar {
    background: #f8f8f8;
}
</style>
<script>
$(function()
{
    $('#redactor').redactor();
});
</script>
 <textarea id="redactor" name="content">...</textarea>

工具栏和输入区域分离

<script>
$(function()
{
    $('#redactor').redactor({
        focus: true,
        toolbarExternal: '#toolbar'
    });
});
</script>
<div id="toolbar"></div>
<p>Lorem ipsum dolor...</p>
 <textarea id="redactor" name="content">...</textarea>

给Redactor增加一个外部的容器

<script>
$(function()
{
    $('#redactor').redactor({
        focus: true,
        toolbarFixedTarget: '#toolbar-box'
    });
});
</script>
<div id="toolbar-box" style="position: relative; height: 300px; overflow: auto;">
    <textarea id="redactor" name="content">...</textarea> 
</div>

Air toolbar ,自动隐藏的工具栏,那操作,那浮现

<script>
$(function()
{
    $('#redactor').redactor({
        air: true,
        imageUpload: '/your-upload-script/'
    });
});
</script>
<textarea id="redactor" name="content">...</textarea>

就这些工具栏的功能,就是很多富文本编辑所没有的。 ...

登录 | 立即注册

更新于:2018-02-02 20:44:28
    您需要登录后才可以评论。 登录 | 立即注册
    相关内容

    富文本编辑器

    个人比较喜欢的是 Redactor,还有Simditor、wangEditor和 bootstrap-wysiwyg,这些富文本的UI都很好看,特别是Red...

    富文本编辑器Redactor在Yii2中的应用

    富文本粘贴处理还是没把www.cnblogs.com上的复制代...

    富文本粘贴处理还是没把www.cnblogs.com上的复制代码的样式去掉 20200405

    Yii2模型简介

    模型Model是MVC模型中的M,是业务数据、业务规则和业务逻辑的对象。Yii很好的展现了这点,用户可用创...

    Yii2模型简介-属性

    Yii2模型简介-场景

    Yii2模型简介-验证规则

    Yii2模型简介-块赋值

    Yii2模型简介-非安全属性

    Yii2模型简介-数据导出

    Yii2模型简介-字段

    Yii2模型简介-最佳实践

    Yii2扩展整理

    这里整理一些自己实测好用的Yii2扩展 20200406

    【坑,勿用】Yii的yii-xunsearch扩展,支持中文的搜索引擎,

    简单,易用的yii2导入和导出组件( illusion/yii2-excel)

    Yii2小部件Widget

    Widgets 小部件kop/yii2-scroll-pager:瀑布滚动翻页 样式不怎么好看,必须点击更多才能加载更多yii2-widget-linkpager...
    推荐内容

    怎样使用V2Ray代理和SSTap玩如魔兽世界/绝地求生/LOL台...

    在网上找的ss+SSTap的方式都不能通过SSTap的链接测试。最后找到了v2ray+SSTap的方式。 注意事项,首先单独有v2ray看能不能正常上网。另外加速时要v2ray和SST...

    使用V2Ray的mKCP协议加速游戏

    当前脚本已发布新版本,地址: https://github.com/kuoruan/shell-scripts/raw/master/kcptun/kcptun.sh 旧仓库已废...

    v2rayN已停止工作

    要安装.NET Framework 4.6 或者更高版本

    超省心游戏加速:Wireguard+udp加速(CentOS版)--(

    Wireguard+udpspeeder+udp2raw游戏加速方案 ---------------------------------------错误报告及解决-----------...

    wireguard+udpspeeder+udp2raw多用户配置

    Wireguard+udpspeeder+udp2raw游戏加速方案改进版-实测有效

    Wireguard+udpspeeder+udp2raw游戏加速方案改进版-实测有效

    关于客户端电脑的虚拟网卡配置IP和DNS自动获取