关于layui 下拉列表的change事件详解


Posted in Javascript onSeptember 20, 2019

默认情况下,事件所监听的是全部的form模块元素,但如果你只想监听某一个元素,使用事件过滤器即可。

如:<select lay-filter="test"></select>

监听select

下拉选择框被选中时触发,回调函数返回一个object参数,携带两个成员:

注意:form.render('select');渲染一下 不然你的操作还是不生效 select不是选择器 表示渲染下拉列表 不写表示所有表单都渲染

语法如下

form.on('select(filter)', function(data){
console.log(data.elem); //得到select原始DOM对象
console.log(data.value); //得到被选中的值
console.log(data.othis); //得到美化后的DOM对象
});
form.on('select(search_type)', function(data){
  var html_one='<option value="1">充值</option><option value="2">还本付息</option>';
  if(data.value == 1){
    $("#search_detail").html(html_one);
    form.render('select');
  }else if(data.value == 2){
    var html_two='<option value="3">提现</option><option value="4">购买产品</option>';
    $("#search_detail").html(html_two);
    form.render('select');//select是固定写法 不是选择器
  }

});

上图的search_type就是下拉列表的lat-filter参数的值

lay-filter="search_type"

关于layui 下拉列表的change事件详解

以上这篇关于layui 下拉列表的change事件详解就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript window.document的属性、方法和事件小结
Oct 24 Javascript
JavaScript网页定位详解
Jan 13 Javascript
JavaScript中读取和保存文件实例
May 08 Javascript
JavaScript学习笔记之JS函数
Jan 22 Javascript
jQuery拖动布局其结果保存到数据库
Oct 09 Javascript
Jquery为DIV添加click事件的简单实例
Jun 02 Javascript
js禁止浏览器页面后退功能的实例(推荐)
Sep 01 Javascript
如何获取TypeScript的声明文件.d.ts
May 01 Javascript
layui 弹出删除确认界面的实例
Sep 06 Javascript
js+canvas实现纸牌游戏
Mar 16 Javascript
vue 使用原生组件上传图片的实例
Sep 08 Javascript
js实现随机圆与矩形功能
Oct 29 Javascript
刷新页面后让控制台的js代码继续执行
Sep 20 #Javascript
layui动态绑定事件的方法
Sep 20 #Javascript
利用JS代码自动删除稿件的普通弹幕功能
Sep 20 #Javascript
基于layui table返回的值的多级嵌套的解决方法
Sep 19 #Javascript
layui默认选中table的CheckBox复选框方法
Sep 19 #Javascript
layui 数据表格复选框实现单选功能的例子
Sep 19 #Javascript
基于layui的table插件进行复选框联动功能的实现方法
Sep 19 #Javascript
You might like
数组与类使用PHP的可变变量名需要的注意的问题
2013/06/20 PHP
解决phpcms更换javascript的幻灯片代码调用图片问题
2014/12/26 PHP
详解WordPress中调用评论模板和循环输出评论的PHP函数
2016/01/05 PHP
Symfony实现行为和模板中取得request参数的方法
2016/03/17 PHP
浅谈PHP array_search 和 in_array 函数效率问题
2019/10/15 PHP
checkbox 多选框 联动实现代码
2008/10/22 Javascript
JavaScript Event学习第九章 鼠标事件
2010/02/08 Javascript
用客户端js实现带省略号的分页
2013/04/27 Javascript
js的参数有长度限制吗?发现不能超过2083个字符
2014/04/20 Javascript
jQuery 实现评论等级好评差评特效
2016/05/06 Javascript
Bootstrap布局组件教程之Bootstrap下拉菜单
2016/06/12 Javascript
node.js平台下利用cookie实现记住密码登陆(Express+Ejs+Mysql)
2017/04/26 Javascript
利用Console来Debug的10个高级技巧汇总
2018/03/26 Javascript
angular 未登录状态拦截路由跳转的方法
2018/10/09 Javascript
基于Bootstrap和JQuery实现动态打开和关闭tab页的实例代码
2019/06/10 jQuery
微信小程序的开发范式BeautyWe.js入门详解
2019/07/10 Javascript
JS实现移动端点击按钮复制文本内容
2019/07/28 Javascript
JQuery通过键盘控制键盘按下与松开触发事件
2020/08/07 jQuery
js实现直播点击飘心效果
2020/08/19 Javascript
Python基于sftp及rsa密匙实现远程拷贝文件的方法
2016/09/21 Python
浅谈Python对内存的使用(深浅拷贝)
2018/01/17 Python
python常用函数与用法示例
2019/07/02 Python
Pytorch在NLP中的简单应用详解
2020/01/08 Python
django rest framework 过滤时间操作
2020/07/12 Python
HTML5实现锚点时请使用id取代name
2013/09/06 HTML / CSS
写求职信有什么意义
2014/02/17 职场文书
运动会口号大全
2014/06/07 职场文书
机关党建工作汇报材料
2014/08/20 职场文书
中学生关于梦想的演讲稿
2014/08/22 职场文书
2014领导班子四风问题查摆思想汇报
2014/09/13 职场文书
2014年纪检工作总结
2014/11/12 职场文书
个人自荐书范文
2015/03/09 职场文书
2015年社区民政工作总结
2015/04/21 职场文书
干部培训简讯
2015/07/20 职场文书
golang 语言中错误处理机制
2021/08/30 Golang
Python 读取千万级数据自动写入 MySQL 数据库
2022/06/28 Python