layui监听select变化,以及设置radio选中的方法


Posted in Javascript onSeptember 24, 2019

一、select监听

1.首先,要给select加一个layui提供的属性 lay-filter=“level” 这里面的level自己定义,下面会用到

2.导入form

layui.use('form', function(){
    var form = layui.form; //只有执行了这一步,部分表单元素才会自动修饰成功
    form.on('select(level)'),function() {
    //内容
});
    form.render();//注意如果是动态添加的select ,就必须加这行代码
 
  });

可以不用加第一行的代码 layui.use这行

二、radio选中

首选要将layui提供的form表单放在当前函数最下面

layui.use('form', function(){
      var form = layui.form; //只有执行了这一步,部分表单元素才会自动修饰成功
      form.render();
    });

然后使用jquery的each 以及根据name找dom元素的方法进行设计

$.each($("input[name='usex']") ,function (index, data) {//index是索引,从0开始

      if( data.value == '男' ) {
        // alert(usex);
        $(data).prop('checked',true);//data表示数据的内容,比如男女
       
      }
    })

在这里也强调下关于select的初显示,如果想让他第一次出现在你想让的显示的一个Option上也需要吧layui.use放在最下面

以上这篇layui监听select变化,以及设置radio选中的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js 深拷贝函数
Dec 04 Javascript
js弹窗代码 可以指定弹出间隔
Jul 03 Javascript
JavaScript判断用户是否对表单进行了修改的方法
Mar 18 Javascript
详解AngularJS中的http拦截
Feb 09 Javascript
jQuery的文档处理程序详解
May 10 Javascript
DIV+CSS+jQ实现省市联动可扩展
Jun 22 Javascript
jQuery简单实现彩色云标签效果示例
Aug 01 Javascript
Bootstrap Table的使用总结
Oct 08 Javascript
vue实现抖音时间转盘
Sep 08 Javascript
js回调函数原理与用法案例分析
Mar 04 Javascript
Electron实现应用打包、自动升级过程解析
Jul 07 Javascript
JavaScript 原型与原型链详情
Nov 02 Javascript
layui 监听select选择 获取当前select的ID名称方法
Sep 24 #Javascript
layui监听下拉选框选中值变化的方法(包含监听普通下拉选框)
Sep 24 #Javascript
layui将table转化表单显示的方法(即table.render转为表单展示)
Sep 24 #Javascript
JavaScript RegExp 对象用法详解
Sep 24 #Javascript
在LayUI图片上传中,解决由跨域问题引起的请求接口错误的方法
Sep 24 #Javascript
解决layui table表单提示数据接口请求异常的问题
Sep 24 #Javascript
关于layui时间回显问题的解决方法
Sep 24 #Javascript
You might like
经典PHP加密解密函数Authcode()修复版代码
2015/04/05 PHP
php正则修正符用法实例详解
2016/12/29 PHP
PHP+Ajax实现的无刷新分页功能详解【附demo源码下载】
2017/07/03 PHP
PHP SFTP实现上传下载功能
2017/07/26 PHP
PHP中Static(静态)关键字功能与用法实例分析
2019/04/05 PHP
js调用后台、后台调用前台等方法总结
2014/04/17 Javascript
浅谈JS日期(Date)处理函数
2014/12/07 Javascript
基于jquery的手风琴图片展示效果实现方法
2014/12/16 Javascript
JS+CSS实现简单的二级下拉导航菜单效果
2015/09/21 Javascript
jQuery使用模式窗口实现在主页面和子页面中互相传值的方法
2016/03/01 Javascript
把多个JavaScript函数绑定到onload事件处理函数上的方法
2016/09/04 Javascript
Bootstrap Table的使用总结
2016/10/08 Javascript
AngularJS中如何使用echart插件示例详解
2016/10/26 Javascript
Javascript 正则表达式校验数字的简单实例
2016/11/02 Javascript
使用纯JS代码判断字符串中有多少汉字的实现方法(超简单实用)
2016/11/12 Javascript
利用JS实现文字的聚合动画效果
2017/01/22 Javascript
JavaScript实现微信号随机切换代码
2018/03/09 Javascript
npm配置国内镜像资源+淘宝镜像的方法
2018/09/07 Javascript
Vue项目pdf(base64)转图片遇到的问题及解决方法
2018/10/19 Javascript
整理Python最基本的操作字典的方法
2015/04/24 Python
Python实现公历(阳历)转农历(阴历)的方法示例
2017/08/22 Python
Python学习之用pygal画世界地图实例
2017/12/07 Python
浅析Python3爬虫登录模拟
2018/02/07 Python
Python的numpy库中将矩阵转换为列表等函数的方法
2018/04/04 Python
python实现逆序输出一个数字的示例讲解
2018/06/25 Python
Pycharm生成可执行文件.exe的实现方法
2020/06/02 Python
CSS3 Flexbox中flex-shrink属性的用法示例介绍
2013/12/30 HTML / CSS
HTML5中如何显示视频呢 HTML5视频播放demo
2013/06/08 HTML / CSS
小学教师自我剖析材料
2014/09/29 职场文书
教师查摆问题及整改措施
2014/10/11 职场文书
销售员自我评价
2015/03/11 职场文书
2015年暑假生活总结
2015/07/13 职场文书
2016年安全月活动总结
2016/04/06 职场文书
爱岗敬业事迹材料
2019/06/20 职场文书
奖学金申请书(范文)
2019/08/14 职场文书
vue实力踩坑之push当前页无效
2022/04/10 Vue.js