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 相关文章推荐
javascript下判断一个元素是否存在的代码
Mar 05 Javascript
在jQuery中 关于json空对象筛选替换
Apr 15 Javascript
jQuery拖拽插件gridster使用指南
Apr 21 Javascript
jquery实现简单的自动播放幻灯片效果
Jun 13 Javascript
省市区三级联动下拉框菜单javascript版
Aug 11 Javascript
jQuery实现的网页左侧在线客服效果代码
Oct 23 Javascript
详解Bootstrap四种图片样式
Jan 04 Javascript
Vue.js学习笔记之常用模板语法详解
Jul 25 Javascript
jQuery实现腾讯信用界面(自制刻度尺)样式
Aug 15 jQuery
原生JS进行前后端同构
Apr 22 Javascript
vue自定义移动端touch事件之点击、滑动、长按事件
Jul 10 Javascript
node+vue实现文件上传功能
May 28 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检测图片木马多进制编程实践
2013/04/11 PHP
解析php开发中的中文编码问题
2013/08/08 PHP
php简单防盗链实现方法
2015/07/29 PHP
Yii2如何批量添加数据
2016/05/17 PHP
php获得文件夹下所有文件的递归算法的简单实例
2016/11/01 PHP
thinkPHP5.0框架配置格式、加载解析与读取方法
2017/03/17 PHP
Mac下php 5升级到php 7的步骤详解
2017/04/26 PHP
PHP观察者模式定义与用法实例分析
2019/03/22 PHP
BOOM vs RR BO5 第一场 2.14
2021/03/10 DOTA
jquery操作select option 的代码小结
2011/06/21 Javascript
javascript 进阶篇1 正则表达式,cookie管理,userData
2012/03/14 Javascript
cookie的复制与使用记住用户名实现代码
2013/11/04 Javascript
Ext修改GridPanel数据和字体颜色、css属性等
2014/06/13 Javascript
js父页面与子页面不同时显示的方法
2014/10/16 Javascript
详解Angular Reactive Form 表单验证
2017/07/06 Javascript
React Native之prop-types进行属性确认详解
2017/12/19 Javascript
详解nodejs通过响应回写的方式渲染页面资源
2018/04/07 NodeJs
javascript之分片上传,断点续传的实际项目实现详解
2019/09/05 Javascript
jquery实现上传图片功能
2020/06/29 jQuery
Vue+Java+Base64实现条码解析的示例
2020/09/23 Javascript
[52:08]DOTA2上海特级锦标赛主赛事日 - 3 败者组第三轮#2Fnatic VS OG第一局
2016/03/05 DOTA
python实现的重启关机程序实例
2014/08/21 Python
使用python实现省市三级菜单效果
2016/01/20 Python
python3爬取各类天气信息
2018/02/24 Python
Python使用pyh生成HTML文档的方法示例
2018/03/10 Python
用TensorFlow实现多类支持向量机的示例代码
2018/04/28 Python
对pandas里的loc并列条件索引的实例讲解
2018/11/15 Python
Python实现TCP探测目标服务路由轨迹的原理与方法详解
2019/09/04 Python
HTML5 常见面试题之PC端和移动端区别介绍
2018/01/22 HTML / CSS
美国厨房和园艺工具网上商店:Nestneed
2019/08/24 全球购物
英国最受欢迎的平价女士时装零售商:Roman Originals
2019/11/02 全球购物
家长会主持词开场白
2014/03/18 职场文书
会计求职信
2014/05/29 职场文书
社会体育专业大学生职业生涯规划书
2014/09/17 职场文书
班干部竞选演讲稿(精选5篇)
2019/09/24 职场文书
源码分析Redis中 set 和 sorted set 的使用方法
2022/03/22 Redis