layui-select动态选中值的例子


Posted in Javascript onSeptember 23, 2019

layui的select在form渲染后,会重新构造一份DOM数据,将原生的select元素隐藏了。

我是使用的vue动态绑定的options,这里绑定v-model就失效了。

我想编辑某行的时候,动态选中select的值。

1.需要改变对应input的显示值。

2.对应新构造的select中的值,layui-this样式标识选中。

那么在table编辑的时候,代码如下:

var $div = $("#categoryParentCode").next();
   $div.find('.layui-this').removeClass('layui-this');
   var parentCode = row.data.ParentCode;
   if(parentCode!==""){
    $div.find('div input').val(parentCode);
 
    $div.find('dl dd[lay-value="'+parentCode+'"]').addClass('layui-this');
   }else{
    $div.find('div input').val("");
   }

就可以动态选中了。

layui使用版本:2.2.45

以上这篇layui-select动态选中值的例子就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
让你的网站可编辑的实现js代码
Oct 19 Javascript
Underscore.js 的模板功能介绍与应用
Dec 24 Javascript
浅谈Jquery为元素绑定事件
Apr 27 Javascript
jquery遍历函数siblings()用法实例
Dec 24 Javascript
关于input全选反选恶心的异常情况
Jul 24 Javascript
js阻止冒泡和默认事件(默认行为)详解
Oct 20 Javascript
Node.js开发教程之基于OnceIO框架实现文件上传和验证功能
Nov 30 Javascript
element-ui 表格实现单元格可编辑的示例
Feb 26 Javascript
node打造微信个人号机器人的方法示例
Apr 26 Javascript
Angularjs中date过滤器失效的问题及解决方法
Jul 06 Javascript
vue中$nextTick的用法讲解
Jan 17 Javascript
Element Backtop回到顶部的具体使用
Jul 27 Javascript
layui多图上传实现删除功能的例子
Sep 23 #Javascript
layui 上传插件 带预览 非自动上传功能的实例(非常实用)
Sep 23 #Javascript
详解从vue-loader源码分析CSS Scoped的实现
Sep 23 #Javascript
layer ui 导入文件之前传入数据的实例
Sep 23 #Javascript
Node.js实现简单管理系统
Sep 23 #Javascript
webpack的pitching loader详解
Sep 23 #Javascript
layui 富文本图片上传接口与普通按钮 文件上传接口的例子
Sep 23 #Javascript
You might like
PHP系列学习之日期函数使用介绍
2012/08/18 PHP
php生成唯一的订单函数分享
2015/02/02 PHP
jquery 利用show和hidden实现级联菜单示例代码
2013/08/09 Javascript
jQuery实现图片信息的浮动显示实例代码
2013/08/28 Javascript
JQuery性能优化的几点建议
2014/05/14 Javascript
简述JavaScript对传统文档对象模型的支持
2015/06/16 Javascript
简单谈谈javascript中的变量、作用域和内存问题
2015/08/30 Javascript
jquery ui dialog替代confirm实例分析
2016/01/25 Javascript
easyui datebox 时间限制,datebox开始时间限制结束时间,datebox截止日期比起始日期大的实现代码
2017/01/12 Javascript
vuex中的 mapState,mapGetters,mapActions,mapMutations 的使用
2018/04/13 Javascript
利用Bootstrap Multiselect实现下拉框多选功能
2019/04/08 Javascript
express + jwt + postMan验证实现持久化登录
2019/06/05 Javascript
jQuery/JS监听input输入框值变化实例
2019/10/17 jQuery
vue input标签通用指令校验的实现
2019/11/05 Javascript
jQuery实现增删改查
2020/12/22 jQuery
Python去掉字符串中空格的方法
2014/03/11 Python
python实现根据图标提取分类应用程序实例
2014/09/28 Python
Python找出文件中使用率最高的汉字实例详解
2015/06/03 Python
python3新特性函数注释Function Annotations用法分析
2016/07/28 Python
Python 性能优化技巧总结
2016/11/01 Python
详解python使用Nginx和uWSGI来运行Python应用
2018/01/09 Python
详解Python 实现元胞自动机中的生命游戏(Game of life)
2018/01/27 Python
一看就懂得Python的math模块
2018/10/21 Python
Python中fnmatch模块的使用详情
2018/11/30 Python
Python内置类型性能分析过程实例
2020/01/29 Python
python GUI库图形界面开发之PyQt5滚动条控件QScrollBar详细使用方法与实例
2020/03/06 Python
用python写爬虫简单吗
2020/07/28 Python
关于CSS Tooltips(鼠标经过时显示)的效果
2013/04/10 HTML / CSS
Html5 audio标签样式的修改
2016/01/28 HTML / CSS
Linux文件系统类型
2012/09/16 面试题
学生会部长竞聘书
2014/03/31 职场文书
企业优秀员工事迹材料
2014/05/28 职场文书
法制宣传口号
2014/06/16 职场文书
2015年学校减负工作总结
2015/05/19 职场文书
2015年个人实习工作总结
2015/05/28 职场文书
通知怎么写?
2019/04/17 职场文书