1. 需求分析

如图所示,需要在用户编辑的时候能够回显数据,并且使其能够自动渲染下拉框。

     <div class="layui-form-item"><label class="layui-form-label">用户性别:</label><div class="layui-input-block"><select name="gender" id="gender"><option value="" >请选择性别</option><option value="1">男</option><option value="0">女</option></select></div></div>

2.layui的DOM渲染结构图

3.如何实现自动选择?

通过以上的分析结果可以得知,我们只要拿到自己想要选择的内容所在的dd元素并对它触发点击事件,即可实现select加载时自动选择操作。

var select = 'dd[lay-value=' + data.gender + ']';

触发点击事件,实现自动选择,由于我使用的layer.open,需要从子页面中去获取值,所以需要在前面加上layero.find("iframe")[0].contentWindow,layui具体详情使用方法,请参考layui.com官网教程进行学习。

layero.find("iframe")[0].contentWindow.$('#gender')
.siblings("div.layui-form-select").find('dl').find(select).click();

以上能够解决layui回显数据不能够自动选中的问题。

layer.open回显数据select选择默认值相关推荐

  1. ElementUI中的el-select中多选回显数据后没法重新选择和更改

    场景 ElementUI的el-select怎样实现下拉多选并实现给下拉框赋值和获取值: https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/detai ...

  2. js填充select下拉框并选择默认值

    /* 使用json数组填充下拉框并复选 *//* 初始化下拉框数据 */ var jsonStr = { "data": [] }; for (var str in JsonStr ...

  3. React之antd Form回显数据

    转自:https://blog.csdn.net/welkin_qing/article/details/110004969 文章目录 一.antd4如何回显数据 1. 定义变量 2. 保存接口数据到 ...

  4. ElementUI中el-radio-group使用v-model绑定是属性为String字符串类型时不回显数据

    场景 结合el-radio-group元素和子元素el-radio可以实现单选组,在el-radio-group中绑定v-model,在el-radio中设置好label即可,无需再给每一个el-ra ...

  5. JSP第四篇【EL表达式介绍、获取各类数据、11个内置对象、执行运算、回显数据、自定义函数、fn方法库】...

    什么是EL表达式? 表达式语言(Expression Language,EL),EL表达式是用"${}"括起来的脚本,用来更方便的读取对象! EL表达式主要用来读取数据,进行内容的 ...

  6. vue页面回显数据_解决vue表单回显数据无法修改的问题

    前言:今天在做修改操作的时候遇到了一个问题,数据回显到修改表单之后,发现无法输入,也不能实现修改 项目环境:springboot+vue前后端分离 问题:修改操作数据回显无法输入值 一.问题截图 二. ...

  7. vue el-tree 同时向后台传递选中和半选节点数据 (回显数据勾选问题已解决)

    vue el-tree 同时向后台传递选中和半选节点数据 (回显数据勾选问题已解决) 参考文章: (1)vue el-tree 同时向后台传递选中和半选节点数据 (回显数据勾选问题已解决) (2)ht ...

  8. JSP第四篇【EL表达式介绍、获取各类数据、11个内置对象、执行运算、回显数据、自定义函数、fn方法库】(修订版)...

    前言 只有光头才能变强. 文本已收录至我的GitHub仓库,欢迎Star:https://github.com/ZhongFuCheng3y/3y 什么是EL表达式? 表达式语言(Expression ...

  9. JSP第四篇【EL表达式介绍、获取各类数据、11个内置对象、执行运算、回显数据、自定义函数、fn方法库】

    什么是EL表达式? 表达式语言(Expression Language,EL),EL表达式是用"${}"括起来的脚本,用来更方便的读取对象! EL表达式主要用来读取数据,进行内容的 ...

最新文章

  1. P1462 通往奥格瑞玛的道路[最短路+二分+堆优化]
  2. 009_storage.conf配置详情
  3. sublime使用技巧总结
  4. sparkStreaming连接kafka整合hbase和redis
  5. java 查询solr_java实现简单的solr查询
  6. 单片机STM8S测量电压电路_单片机设计的胶带输送机智能模糊检测系统,准确性高,胶带寿命长...
  7. ASP.NET AJAX,WCF,ADO.NET Entity 开发实例
  8. Qt 发布 Android 自动驾驶技术预览
  9. C++ 中 Windows 编程概述
  10. win10系统HP打印机驱动程序无法使用
  11. npp 插件html,Notepad++中常用的插件
  12. Linux系统安装sentaurus,Synopsys Sentaurus_vA_2008.09-SP1安装详解.pdf
  13. matlab 8750h,[多图]九代i7-9750H笔记本标压处理器与前代8750H性能对比
  14. python英寸和厘米互换_将厘米转换为英寸的Python程序
  15. c语言指数公式_c语言指数函数
  16. 57-20210402华为海思Hi3516DV300的linux系统下NFS文件系统挂载(eMMC模式)
  17. 发射蓝色/绿色/红外金属卤化物CsPbBr钙钛矿量子点发光二极管
  18. Nape刚体body.align();
  19. OpenCV每日函数 结构分析和形状描述符(8) fitLine函数 拟合直线
  20. QAP内建包迁移教程

热门文章

  1. 有关线程安全的概念范畴
  2. 转 android有用代码片段
  3. VS2013/2012 下无法打开 源 文件“stdafx.h”的解决方法
  4. LoadRunner常见错误代码解决方案
  5. Hbase CallQueueTooBigException 异常处理
  6. spring使用@Value注解读取.properties文件时出现中文乱码问题的解决
  7. 全民K歌推荐系统架构、算法及后台设计实践
  8. 声明式智能推荐系统应用架构探索
  9. 知乎高赞:遇到问题,有哪些有效的分析方法?
  10. NLP算法求建议 | 腾讯 VS 美团