layui富文本编辑器前端无法取值的解决方法


Posted in Javascript onSeptember 18, 2019

首先,需要简单说下layui这个框架,个人觉得属于那种比较好用的框架,包括他的极简流畅的弹框,很适合那种主要写后端的程序员和快速开发的团队

本期主要讲的是layui富文本编辑器这个东西,他的模式是在某个textarea的基础上建立了一个富文本编辑器,也就是说你填写在富文本编辑器的值其实是放在编辑器里面的,并没有放在之前的textarea中,你获取textarea的值的时候需要先把富文本编辑器的值同步到之前的textarea中,然后才能通过textarea获取对应的值

主要代码如下:

layui富文本编辑器前端无法取值的解决方法

下图是通过浏览器生成的js样式:

layui富文本编辑器前端无法取值的解决方法

通过上图可以发现目前富文本编辑器的值与创建的textarea的值没有关系

注意:我这里用的弹出框动态渲染来做的,不管是静态的还是动态的,一定要在富文本编辑器修饰完成之后才可以同步值,因为html他是按照从上到下的顺序来加载的

如图:需要再提交之前同步数据: layedit.sync(indexs);

layui富文本编辑器前端无法取值的解决方法

indexs 这个参数是创建富文本编辑器后生成的索引,只有通过他才可以取出富文本编辑器的值,

如果跟我一样采用的是动态渲染最好把indexs定义成全局的,不然 在yes这个方法中是拿不到indexs的

然后就可以用id选择器的val()属性去获取了。

还有一点就是执行上传的 时候的返回值,一定要遵循他的规则:

"{\"code\":0,\"msg\":\"上传成功\",\"data\":{\"src\":\""+request.getContextPath() + "/upload/home/"+tempName+ "\"}}";

src后面的图片路径以自己的具体项目为主,这里仅供参考

具体内容可以去layui官方文档查看:http://www.layui.com/doc/modules/layedit.html

以上这篇layui富文本编辑器前端无法取值的解决方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js confirm()方法的使用方法实例
Jul 13 Javascript
JavaScript实现的简单拖拽效果
Jun 01 Javascript
js获取及判断键盘按键的方法
Dec 01 Javascript
jQuery实现隔行变色的方法分析(对比原生JS)
Nov 18 Javascript
老生常谈ES6中的类
Jul 31 Javascript
JQuery通过后台获取数据遍历到前台的方法
Aug 13 jQuery
对layui中表单元素的使用详解
Aug 15 Javascript
React router动态加载组件之适配器模式的应用详解
Sep 12 Javascript
vue实现循环切换动画
Oct 17 Javascript
ionic使用angularjs表单验证(模板验证)
Dec 12 Javascript
vue 设置 input 为不可以编辑的实现方法
Sep 19 Javascript
javascript实现滚动条效果
Mar 24 Javascript
使用layui 的layedit定义自己的toolbar方法
Sep 18 #Javascript
Typescript的三种运行方式(小结)
Sep 18 #Javascript
微信小程序授权登陆及每次检查是否授权实例代码
Sep 18 #Javascript
layui的layedit富文本赋值方法
Sep 18 #Javascript
vue语法自动转typescript(解放双手)
Sep 18 #Javascript
快速解决layui弹窗按enter键不停弹窗的问题
Sep 18 #Javascript
layui 实现二级弹窗弹出之后 关闭一级弹窗的方法
Sep 18 #Javascript
You might like
基于qmail的完整WEBMAIL解决方案安装详解
2006/10/09 PHP
隐藏X-Space个人空间下方版权方法隐藏X-Space个人空间标题隐藏X-Space个人空间管理版权方法
2007/02/22 PHP
解决163/sohu/sina不能够收到PHP MAIL函数发出邮件的问题
2009/03/13 PHP
谈谈PHP中substr和substring的正确用法及相关参数的介绍
2015/12/16 PHP
PHP判断FORM表单或URL参数来的数据是否为整数的方法
2016/03/25 PHP
利用PHP访问带有密码的Redis方法示例
2017/02/09 PHP
基于JQuery的Select选择框的华丽变身
2011/08/23 Javascript
Array.prototype.concat不是通用方法反驳[译]
2012/09/20 Javascript
js判断数据类型如判断是否为数组是否为字符串等等
2014/01/15 Javascript
第十章之巨幕页头缩略图与警告框组件
2016/04/25 Javascript
js 求时间差的实现代码
2016/04/26 Javascript
Vue自定义指令介绍(2)
2016/12/08 Javascript
Bootstrap源码解读下拉菜单(4)
2016/12/23 Javascript
微信小程序实现根据字母选择城市功能
2017/08/16 Javascript
使用JavaScript保存文本文件到本地的两种方法
2019/01/22 Javascript
layui当点击文本框时弹出选择框,显示选择内容的例子
2019/09/02 Javascript
JavaScript使用prototype属性实现继承操作示例
2020/05/22 Javascript
[02:43]2018DOTA2亚洲邀请赛主赛事首日TOP5
2018/04/04 DOTA
Python中使用语句导入模块或包的机制研究
2015/03/30 Python
Python编写百度贴吧的简单爬虫
2015/04/02 Python
Python赋值语句后逗号的作用分析
2015/06/08 Python
python 3.6 +pyMysql 操作mysql数据库(实例讲解)
2017/12/20 Python
Python openpyxl模块原理及用法解析
2020/01/19 Python
世界上最大的各式箱包网络零售店:eBag
2016/07/21 全球购物
eBay荷兰购物网站:eBay.nl
2020/06/26 全球购物
个人求职简历的自我评价范文
2013/10/09 职场文书
点菜员岗位职责范本
2014/02/14 职场文书
开工仪式策划方案
2014/05/23 职场文书
设备售后服务承诺书
2014/05/30 职场文书
服务标语口号
2014/07/01 职场文书
业绩倒数第一的检讨书
2014/09/24 职场文书
校长一岗双责责任书
2015/05/09 职场文书
董事会决议范本
2015/07/01 职场文书
人民币使用说明书
2019/04/17 职场文书
使用Python脚本对GiteePages进行一键部署的使用说明
2021/05/27 Python
css3带你实现3D转换效果
2022/02/24 HTML / CSS