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 相关文章推荐
我的Node.js学习之路(三)--node.js作用、回调、同步和异步代码 以及事件循环
Jul 06 Javascript
JavaScript实现动态创建CSS样式规则方案
Sep 06 Javascript
JS密码生成与强度检测完整实例(附demo源码下载)
Apr 06 Javascript
Javascript在IE和Firefox浏览器常见兼容性问题总结
Aug 03 Javascript
浅谈jquery之on()绑定事件和off()解除绑定事件
Oct 26 Javascript
深入浅析Vue组件开发
Nov 25 Javascript
Vue组件开发之LeanCloud带图形校验码的短信发送功能
Nov 07 Javascript
详解a标签添加onclick事件的几种方式
Mar 29 Javascript
如何让微信小程序页面之间的通信不再变困难
Jun 03 Javascript
js模拟F11页面全屏显示
Sep 17 Javascript
vue-cli+iview项目打包上线之后图标不显示问题及解决方法
Oct 16 Javascript
p5.js实现动态图形临摹
Oct 23 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
基于Discuz security.inc.php代码的深入分析
2013/06/03 PHP
PHP网络操作函数汇总
2015/05/18 PHP
php算法实例分享
2015/07/14 PHP
Yii开启片段缓存的方法
2016/03/28 PHP
Yii2针对指定url的生成及图片等的引入方法小结
2016/07/18 PHP
Laravel 5.3 学习笔记之 安装
2016/08/28 PHP
阿里云的WindowsServer2016上部署php+apache
2018/07/17 PHP
Laravel使用模型实现like模糊查询的例子
2019/10/24 PHP
PHP实现简易用户登录系统
2020/07/10 PHP
jQuery及JS实现循环中暂停的方法
2015/02/02 Javascript
js改变html的原有内容实现方法
2016/10/05 Javascript
Angular.js初始化之ng-app的自动绑定与手动绑定详解
2017/07/31 Javascript
浅谈angular2 组件的生命周期钩子
2017/08/12 Javascript
Vue实现typeahead组件功能(非常靠谱)
2017/08/26 Javascript
微信小程序 按钮滑动的实现方法
2017/09/27 Javascript
详解Vue路由History mode模式中页面无法渲染的原因及解决
2017/09/28 Javascript
JavaScript 严格模式(use strict)用法实例分析
2020/03/04 Javascript
Python写的Socks5协议代理服务器
2014/08/06 Python
Python脚本在Appium库上对移动应用实现自动化测试
2015/04/17 Python
python删除过期文件的方法
2015/05/29 Python
python3实现读取chrome浏览器cookie
2016/06/19 Python
Python实现打印螺旋矩阵功能的方法
2017/11/21 Python
python实现冒泡排序算法的两种方法
2018/03/10 Python
Python对CSV、Excel、txt、dat文件的处理
2018/09/18 Python
Python 获取windows桌面路径的5种方法小结
2019/07/15 Python
Python对接六大主流数据库(只需三步)
2019/07/31 Python
基于python 等频分箱qcut问题的解决
2020/03/03 Python
python3 os进行嵌套操作的实例讲解
2020/11/19 Python
python gui开发——制作抖音无水印视频下载工具(附源码)
2021/02/07 Python
元旦活动感言
2014/03/08 职场文书
工程售后服务方案
2014/06/08 职场文书
体育个人工作总结
2015/02/09 职场文书
导游词之河北邯郸
2019/09/12 职场文书
pytorch分类模型绘制混淆矩阵以及可视化详解
2022/04/07 Python
MongoDB误操作后使用oplog恢复数据
2022/04/11 MongoDB
Golang 入门 之url 包
2022/05/04 Golang