1、 layui富文本框layedit的使用及内容的禁用
- layui富文本框layedit的使用及内容的禁用
参考网址：https://www.layui.com/doc/modules/layedit.htmljavascript
- 使用。官网实例展现
<textarea id="demo" style="display: none;"></textarea>html
<script>前端
layui.use('layedit', function(){java
var layedit = layui.layedit;jquery
layedit.build('demo'); //创建编辑器ajax
});json
</script>app
实际应用中实例展现编辑器
<!--系统维护公告详情页面-->函数
<!--#include virtual ="include/header.html"-->
<body>
<div class="layui-fluid larry-wrapper">
<section class="panel panel-padding">
<form class="layui-form layui-form-pane form-conmon">
<div class="layui-form-item layui-form-text layui-form-item-sm" style="margin: 10px;">
<label class="layui-form-label">公告内容</label>
<!-- 跟那些过往的编辑器同样，你须要放置一个标签（通常为textarea文本域）做为编辑器的目标元素，而后调用 layedit.build('id') 便可，以下所示：-->
<div class="layui-input-block">
<textarea id="content" name="content" class="layui-textarea"></textarea>
</div>
</div>
</form>
</section>
</div>
</body>
<!--#include virtual ="include/version.html"-->
<script type="text/javascript">
layui.use(['jqform', 'laytpl', 'layer', 'jquery', 'form', 'layedit', 'jqajax'], function () {
var tpl = layui.laytpl,
$ = layui.jquery,
form = layui.form,
layer = layui.layer,
layedit = layui.layedit,
jqajax = layui.jqajax;
var index = layedit.build('content'); //创建编辑器
//获取参数
var id = getUrlParam("id");
var ajax = new jqajax();
ajax.options.method = 'POST';
ajax.options.loading = false;//使用layedit后台会报“layedit is not defined”，一直去加载，这个能够中止加载
ajax.options.contentType = "application/json;charset=UTF-8";
ajax.options.url = "/sys/callboard/getNoticeById";
ajax.options.data = {id: id};
ajax.complete = function (ret, options) {
var data = ret.data;
var informationCode = data.informationCode;
var title = data.title;
var newTitle = title+"_"+informationCode;
var content = data.content;
if (ret.httpCode == 200) {
$("#title").val(newTitle);
/*内容不可编辑。此行必须在setContent函数前修改属性，不然属性设置不成功*/
$("#LAY_layedit_1").contents().find("body[contenteditable]").prop("contenteditable",false);//jquery获取iframe里的内容
layedit.setContent(index,content);
}
};
ajax.ajax(ajax.options);
});
</script>
</html>
将内容设为不可编辑前端代码
