php layui富文本编辑器,Kz.layedit-layui.layedit富文本编辑器拓展

摘要:

本插件基于layui.layedit,增加了HTML源码模式,片插入功能添加alt属性(layupload),视频插入功能,全屏功能,段落格式,字体颜色设置,右键菜单操作,插入锚点,水平线功能。

所有拓展功能菜单按钮图标均引用自layui自带图标。

一、基础拓展配置

tool: [

'html', 'code', 'strong', 'italic', 'underline', 'del', 'addhr', '|', 'fontFomatt', 'colorpicker', 'face'

, '|', 'left', 'center', 'right', '|', 'link', 'unlink', 'image_alt', 'video', 'anchors'

, '|', 'fullScreen'

]

html=> html源码模式(弹窗显示),

addhr=>添加水平线


fontFomatt =>段落格式设置,设置当前行为p,h1~4,div等格式,

colorpicker=>字体颜色设置,

image_alt=>带alt属性,宽高设置的图片上传,(image原版图片上传依旧支持),

video =>视频上传,带封面上传,

anchors=> 添加锚点,通过样式在编辑器内展示,不带样式无法展示,待修复,

fullScreen=>全屏设置

一、HTMl源码模式

HTML源码模式引用第三方插件ace,优化源码展示样式,引用ace编辑器仅保留了html源码样式和tomorrow主题,如有需要可自行更换,目录为/Content/ace/ace.js,指路--> ace官网。

二、UploadImage/UploadVideo

图片视频上传需要配置相应的后台接口,同时也可以设置上传附件格式,附件大小等,该参数继承自layui.layupload。

1 //上传图片参数设置

2 uploadImage: {3 url: '/Attachment/LayUploadFile',//后台上传方法

4 accept: 'image',//限制上传类型

5 acceptMime: 'image/*',6 exts: 'jpg|png|gif|bmp|jpeg',//拓展名限制

7 size: '10240'//大小限制

8 }

1 //上传视频参数设置--同图片

2 uploadVideo: {3 url: '/Attachment/LayUploadFile',4 accept: 'video',5 acceptMime: 'video/*',6 exts: 'mp4|flv|avi|rm|rmvb',7 size: '20480'

8 }

三、CallDel配置

该参数用于右键选中图片或视频进行删除时调用,根据提供的后台方法进行删除,返回的参数图片路径为imgpath,视频路径为 filepath,后台可根据接受的文件路径进行删除或其他操作。

//右键删除图片/视频时的回调参数,post到后台删除服务器文件等操作,

//传递参数:

//图片: imgpath --图片路径

//视频: filepath --视频路径 imgpath --封面路径

, calldel: {

url:'/Attachment/DeleteFile'}

四、Code=>插入代码设置

该参数可配置也可不配置,根据自己的实际需求出发,如不配置,则为原版的效果,配置hide为true时,会根据defalut设置的语言格式进行插入

//插入代码设置

, codeConfig: {

hide:true, //是否显示编码语言选择框

default: 'javascript' //hide为true时的默认语言格式

}

--未完待续

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值