layui 第三方组件平台

返回首页

[v1.20.4.4]在原有layedit基础上新增 1.html源码模式 2.全屏 3.批量上传图片、插入视频 4.字体颜色、背景色设置、段落格式设置 5.插入表格 6.右键修改图片视频、段落居中格式、删除等功能 7.插入水平线hr 8.锚点 9.插入代码和插入超链接拓展 10.插入自定义链接 11.简单实现撤销重做【不推荐使用】

更新:2021-9-30 创建:2018-11-19

文档

预警:当前版本有限支持IE内核,修复时间未知、、、
最新版本v1.20.4.4已发布 https://gitee.com/KnifeZ/Kz.layedit/releases/v1.20.4.4

Tips: 请前往码云下载

在原有layedit基础上新增
1.html源码模式
2.全屏
3.批量上传图片、插入视频
4.字体颜色、背景色设置、段落格式设置
5.插入表格
6.右键修改图片视频、段落居中格式、删除等功能
7.插入水平线hr
8.锚点
9.插入代码和插入超链接拓展
10.插入自定义链接
11.简单实现撤销重做【不推荐使用】

码云预览页面:
http://knifez.gitee.io/kz.layedit/
上传图片视频等功能需配置相应后台接口
我的码云项目主页- https://gitee.com/KnifeZ_Game

软件架构说明
HTML源码模式 引用第三方插件ace,优化源码展示样式。
引用ace编辑器仅保留了html源码样式和tomorrow主题,如有需要可自行更换

打包上传比较麻烦,推荐码云下载 [嘻嘻]
更新日志v20.04.04
[修复] 删除空元素报错,原因为判定图片的条件设置错误,已修正
v19.04.12
[修复#IVA7B] 插入表格后无法提交问题 感谢ftlh2005的反馈
v19.03.22
[修复] 多图上传设置宽高报错问题
V19.03.20
[修复] 当p标签内存在多张图片时back键调用callDel删除时始终获取的是第一张图片src的bug
[新增] del键删除图片调用callDel回调方法
V19.03.18
[修复] 粘贴图片时错误的粘贴到编辑器顶部而不是鼠标光标处
V19.03.02
[修复] 全屏下查看源代码内容过长时最后几行看不到问题
[优化] 全屏模式下背景色改为白色
V19.01.26
[修复] 监听事件container.tagName为undefined错误 感谢yianyao的反馈
V19.01.25
[优化] ctrl+b 加粗使用strong标签替换原版b标签
[修复] 段落格式 和 字体大小 可能出现点击后即自动关闭的问题
V19.01.24
[优化] 支持从word粘贴内容保留格式,去除多余标签
V19.01.23
[移除] V19.01.22-beta-[3] 报 无法获取图片路径 的提示,,不过原先会提示的图片依旧无法从服务器删除
[修复] 编辑器内容为空时回车换行添加的标签为div,昨天更新时不小心覆盖掉了、已修复为追加p标签
[修复] 图片上传宽高兼容%后设置无效问题 --感谢不愿意透露姓名的网友反馈 :smile:
V19.01.22-beta
[优化] 图片上传宽高兼容%设置
[修复] 编辑器内容为空时回车换行添加的标签为div
[测试] back退格键删除图片时调用callDel配置参数回调服务器删除附件,需配置参数 backDelImg:true (待删除),目前不支持没有p标签或其他元素包裹的img图片删除,会报无法获取图片路径的弹出层,这是正常提示、、
V19.01.19 (感谢biancangming的反馈)
[修复] 粘贴图片不调用uploadImage.done方法
[新增] 插入代码配置codeConfig新增参数 class,可根据需要自定义样式,不填默认为layui-code
V19.01.18
[修复] IR5LC 火狐浏览器菜单宽度异常问题
[新增] preview预览样式设置参数 previewAttr,支出对预览弹出层的area,offset参数设置,修改默认值为area:['50%','100%'],offset:'r'。
[修复] 空编辑器插入视频出现getRangeAt错误和同步textarea异常问题
V19.01.16-beta
[优化] 插入图片时如果不填写描述属性和宽高时,不再添加style="" alt="" 空属性
[修复] 附件上传没有添加data和headers参数,由于我个人不使用这两个参数且测试时都时拿上传图片测试、、、所以未能测试出该问题,对因此造成困扰的人感到抱歉=.=
V19.01.10-beta
[修复] 取消回车/插入元素自动加p标签包裹,防止特殊情况下的段落异常,ul->li标签内文字需p标签或span等包裹,否则回车会新建ul标签导致段落错乱
V19.01.05
[新增] 附件上传自动插入编辑器设置 autoInsert, 添加设置参数 uploadFiles{autoInsert:true} 即可选中文件上传完之后自动插入编辑器,无需点确认按钮

安装教程
index.html为示例文件,可供查看演示功能
将dist下文件layedit.js替换掉layui/lay/modules/layedit.js
正常调用layedit即可
        layui.use(['layedit', 'layer', 'jquery'], function () {
var $ = layui.jquery;
var layedit = layui.layedit;
layedit.set({
//暴露layupload参数设置接口 --详细查看layupload参数说明
uploadImage: {
url: '/Attachment/LayUploadFile',
accept: 'image',
acceptMime: 'image/*',
exts: 'jpg|png|gif|bmp|jpeg',
size: '10240'
}
, uploadVideo: {
url: '/Attachment/LayUploadFile',
accept: 'video',
acceptMime: 'video/*',
exts: 'mp4|flv|avi|rm|rmvb',
size: '20480'
}
//右键删除图片/视频时的回调参数,post到后台删除服务器文件等操作,
//传递参数:
//图片: imgpath --图片路径
//视频: filepath --视频路径 imgpath --封面路径
, calldel: {
url: '/Attachment/DeleteFile'
}
//开发者模式 --默认为false
, devmode: true
//插入代码设置
, codeConfig: {
hide: true, //是否显示编码语言选择框
default: 'javascript' //hide为true时的默认语言格式
}
, tool: [
'html', 'code', 'strong', 'italic', 'underline', 'del', 'addhr', '|', 'fontFomatt', 'colorpicker', 'face'
, '|', 'left', 'center', 'right', '|', 'link', 'unlink',‘images’, 'image_alt', 'video', 'anchors'
, '|',‘table’, 'fullScreen'
]
, height: '90%'
});
var ieditor = layedit.build('layeditDemo');
})

下载

立即下载 去码云下载
该扩展组件由第三方用户主动投递,并由其自身进行维护,本站仅做收集。