当前位置: 代码迷 >> 综合 >> layui富文本编辑器注意点
  详细解决方案

layui富文本编辑器注意点

热度:32   发布时间:2023-09-23 11:16:34.0

点击打开一个修改信息的页面,同时显示已有的信息,由于layui 富文本编辑器设置初始化必须在build之前,所有每次点击修改的时候只有第一次点击会build,猜测可能是缓存问题,造成无法获取到数据,原因还是因为数据必须在build之前被设置进去。禁用该页面的浏览器缓存即可。 火狐不需要。ie chrome 都需要禁用,这可能是因为thymeleaf的问题  thymeleaf头是 模板是html5格式,非严格thymeleaf html5验证。

  <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">。

添加头 或者在url后添加随机数Math.random()

<meta http-equiv="cache-control" content="no-cache,no-store, must-revalidate" />
<meta http-equiv="pragma" content="no-cache" />
<meta http-equiv="Expires" content="0" />

下面是 thymeleaf 中 js  初始化必须是在构建富文本之前,否则无效

<script type="text/javascript" th:inline="javascript">/* 只使用jquery  */layui.use(['jquery','layer','form'],function(){  var form = layui.formvar $ = layui.jquery;  $(document).ready(function(){var id = [[${#httpServletRequest.getParameter('id')}]];  //获取传过来的id值$.ajax({url: "../admin/blog/get" ,data: {'id':id} ,type: "get" ,dataType:'json',success:function(result){if([[result.success]]){//location.reload();//已经到了这步了。var index = layer.load(2, {time: 5*1000}); //又换了种风格,并且设定最长等待5秒 /* var resultt = eval("(" + result.responseText + ")"); *//* result = JSON.parse(result.responseText); */$("#title").val(result.title);$("#keyWord").val(result.keyWord);$("#blogTypeId").val(result.blogType.id);form.render('select'); //刷新select选择框渲染$("#LAY_demo_editor").val(result.content);layer.close(index);     }else{layer.msg("加载失败!");}} //end success});//end ajax});		//end $()	});  </script><script th:inline="javascript" type="text/javascript">
/*<![CDATA[*/layui.use(['form', 'layedit', 'laydate', 'jquery', 'layer'],
function() {var form = layui.form,layer = layui.layer,layedit = layui.layedit,laydate = layui.laydate,$ = layui.jquery;//上传图片,必须放在 创建一个编辑器前面layedit.set({uploadImage: {url: '../uploadFile' //接口url,type: 'post' //默认post}});//创建一个编辑器  id=LAY_demo_editorvar editIndex = layedit.build('LAY_demo_editor');//自定义验证规则(只要非空即可)//监听提交form.on('submit(demo1)',function(data) {//获取博客标题var title = data.field["title"]//获取博客类别idvar blogTypeId = data.field["blogTypeId"]//获取博客内容 带标记var content = layedit.getContent(editIndex)//截取博客前155字符 作为博客简介var summary = layedit.getText(editIndex).substr(0, 155);//博客关键词var keyWord = data.field["keyWord"]//获取博客内容  不带标签 纯文本var contentNoTag = layedit.getText(editIndex) ;$.ajax({async: false,url: '../admin/blog/save',data: {//thymeleaf获取request参数id值'id': [[${#httpServletRequest.getParameter('id')}]],'title': title,'blogType.id': blogTypeId,'content': content,'summary': summary,'keyWord': keyWord,'contentNoTag': contentNoTag},type: 'post',success: function(result) {if ([[result.success]]) {layer.alert('修改成功!', {title: '系统提示',icon: 6,},function(index) {//下拉框不会清空,需要手动设值,设置value==selected的为默认选中layer.close(index); //关闭并回到管理页面window.location.href = '/views/blogManage'});} else {layer.alert('修改失败。。', {title: '系统提示',icon: 5,},function(index) {location.reload() //重写加载表格//下拉框不会清空,需要手动设值,设置value==selected的为默认选中$("#blogTypeId").val("selected");layer.close(index); //关闭 重新回调修改页面window.location.href = '/views/modifyBlog'}); //end layer.alert} //end else} //end success}); //end ajaxreturn false;}); //end form on
});	
/*]]>*/</script>