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 相关文章推荐
JQuery CSS样式控制 学习笔记
Jul 23 Javascript
几个javascript操作word的参考代码
Oct 26 Javascript
jquery实现的网页自动播放声音
Apr 30 Javascript
jquery实现右侧栏菜单选择操作
Mar 04 Javascript
原生js代码实现图片放大境效果
Oct 30 Javascript
Bootstrap基本插件学习笔记之Tooltip提示工具(18)
Dec 08 Javascript
AngularJS学习第二篇 AngularJS依赖注入
Feb 13 Javascript
JavaScript基于activexobject连接远程数据库SQL Server 2014的方法
Jul 12 Javascript
利用jquery如何从json中读取数据追加到html中
Dec 01 jQuery
基于vue.js中事件修饰符.self的用法(详解)
Feb 23 Javascript
解决vue-cli脚手架打包后vendor文件过大的问题
Sep 27 Javascript
JavaScript offset实现鼠标坐标获取和窗口内模块拖动
May 30 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 日志缩略名的创建函数代码
2010/05/26 PHP
PHP中file_get_contents函数抓取https地址出错的解决方法(两种方法)
2015/09/22 PHP
通过下拉框的值来确定输入框是否可以为空的代码
2011/10/18 Javascript
javascript简单事件处理和with用法介绍
2013/09/16 Javascript
js代码实现点击按钮出现60秒倒计时
2021/01/28 Javascript
animate 实现滑动切换效果【实例代码】
2016/05/05 Javascript
学习vue.js条件渲染
2016/12/03 Javascript
微信小程序表单验证错误提示效果
2017/05/19 Javascript
jQuery常见面试题之DOM操作详析
2017/07/05 jQuery
JavaScript 通过Ajax 动态加载CheckBox复选框
2017/08/31 Javascript
vue2.0 循环遍历加载不同图片的方法
2018/03/06 Javascript
Vue下滚动到页面底部无限加载数据的示例代码
2018/04/22 Javascript
JS实现的判断方法、变量是否存在功能示例
2020/03/28 Javascript
最适应的vue.js的form提交涉及多种插件【推荐】
2018/08/27 Javascript
Vue props 单向数据流的实现
2018/11/06 Javascript
如何基于原生javaScript生成带图片的二维码
2019/11/21 Javascript
JS代码触发事件代码实例
2020/01/02 Javascript
JavaScript仿京东轮播图效果
2021/02/25 Javascript
python获取Linux下文件版本信息、公司名和产品名的方法
2014/10/05 Python
Python采用socket模拟TCP通讯的实现方法
2014/11/19 Python
python如何拆分含有多种分隔符的字符串
2018/03/20 Python
python抖音表白程序源代码
2019/04/07 Python
Python实现字典按key或者value进行排序操作示例【sorted】
2019/05/03 Python
python爬虫学习笔记之pyquery模块基本用法详解
2020/04/09 Python
python中操作文件的模块的方法总结
2021/02/04 Python
萨克斯第五大道的折扣店:Saks Fifth Avenue OFF 5TH
2016/08/25 全球购物
红色康乃馨酒店:Red Carnation Hotels
2017/06/22 全球购物
艺龙旅行网酒店预订:国内、港澳台酒店
2018/06/26 全球购物
创建索引时需要注意的事项
2013/05/13 面试题
学生励志演讲稿
2014/01/06 职场文书
上课迟到检讨书
2014/02/19 职场文书
外贸采购员岗位职责
2014/03/08 职场文书
领导干部作风建设剖析材料
2014/10/11 职场文书
2014年档案管理工作总结
2014/11/17 职场文书
python中字符串String及其常见操作指南(方法、函数)
2022/04/06 Python
mysql 获取相邻数据项
2022/05/11 MySQL