解决layui下拉框监听问题(监听不到值的变化)


Posted in Javascript onSeptember 28, 2019

关于layui监听下拉框值得变化,大家都知道官方文档给我们提供了一个方法

form.on('select(demo)',function(data){
 console.log(data.value)//打印当前select选中的值
})

按照我之前的理解,监听下拉框值得变化,就是只有下拉框的值发生了改变,才会触发这个事件,否则就不触发。但是这个方法是,只要你鼠标点击了下拉选项里面的值,不论这个值跟之前的值是否相等,都会触发这个事件。

下面说一下我的解决办法

1.首先,我写了一个input框,用来存放select当前选择的value值(这个时候不知道大家是不是跟我想的一样,只要监听这个input框中值得变化不就可以了么,答案是不行。因为动态赋值操作无法触发input的change事件)

2.代码写一下,自己理解

//input值发生变化事件
$(input).on('change',function(){
 console.log('layui下拉框的值发生了变化');
})
 
 
form.on('select(demo)',function(data){
 //判断当前选中的值是否跟input的值相等,相等的话,就不发生change事件,需要注意的是要先判断再赋值
 var inputVal = $(input).val();
 if(data.value !== inputVal ){
  $(input).change();
 }
 $(input).val(data.value)
})

以上这篇解决layui下拉框监听问题(监听不到值的变化)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
可输入的下拉框
Jun 19 Javascript
js+css实现导航效果实例
Feb 10 Javascript
JavaScript实现获得所有兄弟节点的方法
Jul 23 Javascript
jQuery实现TAB选项卡切换特效简单演示
Mar 04 Javascript
javascript简单实现等比例缩小图片的方法
Jul 27 Javascript
基于KO+BootStrap+MVC实现的分页控件代码分享
Nov 07 Javascript
jQuery之动画效果大全
Nov 09 Javascript
实例讲解DataTables固定表格宽度(设置横向滚动条)
Jul 11 Javascript
利用express启动一个server服务的方法
Sep 17 Javascript
vue组件详解之使用slot分发内容
Apr 09 Javascript
layui当点击文本框时弹出选择框,显示选择内容的例子
Sep 02 Javascript
了不起的11个JavaScript代码重构最佳实践小结
Jan 11 Javascript
使用layui监听器监听select下拉框,事件绑定不成功的解决方法
Sep 28 #Javascript
layer.confirm()右边按钮实现href的例子
Sep 27 #Javascript
layer页面跳转,获取html子节点元素的值方法
Sep 27 #Javascript
使用layer模态框给新页面传值的方法
Sep 27 #Javascript
JavaScript实现随机五位数验证码
Sep 27 #Javascript
layer弹出层倒计时关闭的实现方法
Sep 27 #Javascript
layer.alert自定义关闭回调事件的方法
Sep 27 #Javascript
You might like
linux下 C语言对 php 扩展
2008/12/14 PHP
php随机显示指定文件夹下图片的方法
2015/07/13 PHP
详解PHP安装mysql.so扩展的方法
2016/12/31 PHP
JS是否可以跨文件同时控制多个iframe页面的应用技巧
2007/12/16 Javascript
javascript轻松实现当鼠标移开时已弹出子菜单自动消失
2013/12/29 Javascript
js中自定义方法实现停留几秒sleep
2014/07/11 Javascript
JavaScript数组Array对象增加和删除元素方法总结
2015/01/20 Javascript
JavaScript6 let 新语法优势介绍
2016/07/15 Javascript
JS版微信6.0分享接口用法分析
2016/10/13 Javascript
微信小程序开发(一) 微信登录流程详解
2017/01/11 Javascript
jQuery Chosen通用初始化
2017/03/07 Javascript
关于JavaScript语句后面的分号问题
2017/12/07 Javascript
Node.js成为Web应用开发最佳选择的原因
2018/02/05 Javascript
学习React中ref的两个demo示例
2018/08/14 Javascript
微信小程序云开发使用方法新手初体验
2019/05/16 Javascript
基于JavaScript实现简单抽奖功能代码实例
2020/10/20 Javascript
VUE前端从后台请求过来的数据进行转换数据结构操作
2020/11/11 Javascript
Python使用百度API上传文件到百度网盘代码分享
2014/11/08 Python
Python生成随机MAC地址
2015/03/10 Python
python结合opencv实现人脸检测与跟踪
2015/06/08 Python
使用实现pandas读取csv文件指定的前几行
2018/04/20 Python
selenium+python自动化测试之多窗口切换
2019/01/23 Python
Python占用的内存优化教程
2019/07/28 Python
python爬虫selenium和phantomJs使用方法解析
2019/08/08 Python
scrapy头部修改的方法详解
2020/12/06 Python
品管员岗位职责
2013/11/10 职场文书
博士学位自我鉴定范文
2013/12/26 职场文书
手机银行营销方案
2014/03/14 职场文书
演讲稿祖国在我心中
2014/05/04 职场文书
会计求职自荐信
2014/06/20 职场文书
信息合作协议书
2014/10/09 职场文书
应届毕业生求职信范文
2015/03/19 职场文书
网站文案策划岗位职责
2015/04/14 职场文书
2016年第29个世界无烟日宣传活动总结
2016/04/06 职场文书
Spring Data JPA使用JPQL与原生SQL进行查询的操作
2021/06/15 Java/Android
FP-growth算法发现频繁项集——构建FP树
2021/06/24 Python