layui富文本编辑器赋值与取值方法详解
作者:阿沐时间:2026-10-23 11:19:09浏览:567
本文介绍layui框架中富文本编辑器的使用,重点讲解如何调用layedit组件进行内容赋值以及获取编辑后的完整HTML值和纯文本值,提供具体代码示例供参考。
layui富文本编辑器赋值方法
在layui中实现富文本编辑器的内容赋值,首先需要引入layedit模块。通过layui.use加载模块后,获取layedit实例。使用layedit.build方法指定编辑器DOM元素ID来初始化编辑器,该方法返回一个索引值。随后,利用layedit.setContent方法,传入该索引值和需要填充的字符串内容,即可完成对编辑器的赋值操作。
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>layui</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="/Public/lib/layui/css/layui.css" rel="external nofollow" media="all">
</head>
<body>
<textarea id="demo" style="display: none;"></textarea>
<script src="/Public/lib/jquery.min.js"></script>
<script src="/Public/lib/layui/layui.js"></script>
<script>
layui.use(['layedit'], function(){
var layedit=layui.layedit;
var index=layedit.build('demo'); //建立编辑器
layedit.setContent(index,"你好");
});
</script>
</body>
</html>
富文本内容取值与纯文本获取
获取富文本编辑器的内容分为两种情况:获取包含HTML标签的完整内容和仅获取纯文本。调用layedit.getContent方法并传入编辑器索引,可返回编辑器内的完整HTML字符串;若只需去除格式标签获取纯文本,则使用layedit.getText方法并传入相同的索引值,该方法会返回清理后的文本内容。
layedit.getContent(editIndex);//取整个值
layedit.getText(editIndex);//取纯文本值
上述内容涵盖了layui富文本编辑器的基本赋值与取值操作,包括完整HTML值与纯文本值的获取方式,旨在为开发者提供实用的代码参考。
作者最新文章
为什么叫JavaScript:语言命名由来及与Java的历史渊源
2026-11-05 11:37:48
JS获取当前时间年月日时分秒并格式化为YYYY-MM-DD HH:mm:ss
2026-11-04 21:25:21
不同语言间JS与Java/Python加密结果不一致怎么办
2026-11-04 18:27:23
Mock.js 拦截 Axios 和 Fetch 请求的原理与配置方法
2026-11-04 08:13:59
JS怎么获取当前日期并格式化为YYYY-MM-DD
2026-11-03 18:47:03
