解决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 相关文章推荐
菜鸟javascript基础整理1
Dec 06 Javascript
只需20行代码就可以写出CSS覆盖率测试脚本
Apr 24 Javascript
js 数组去重的四种实用方法
Sep 09 Javascript
javascript变量声明实例分析
Apr 25 Javascript
JS iFrame加载慢怎么解决
May 13 Javascript
DOM操作原生js 的bug,使用jQuery 可以消除的解决方法
Sep 04 Javascript
微信小程序 配置文件详细介绍
Dec 14 Javascript
jquery实现自定义图片裁剪功能【推荐】
Mar 08 Javascript
Vue组件中slot的用法
Jan 30 Javascript
ES6 Map结构的应用实例分析
Jun 26 Javascript
微信小程序 WXML节点信息查询详解
Jul 29 Javascript
JS实现电脑虚拟键盘打字测试
Jun 24 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
php中的filesystem文件系统函数介绍及使用示例
2014/02/13 PHP
php实现删除指定目录下相关文件的方法
2014/10/20 PHP
php安装扩展mysqli的实现步骤及报错解决办法
2017/09/23 PHP
js正确获取元素样式详解
2009/08/07 Javascript
前端开发的开始---基于面向对象的Ajax类
2010/09/17 Javascript
使用jQuery实现的掷色子游戏动画效果
2014/03/14 Javascript
在浏览器中实现图片粘贴的jQuery插件-- pasteimg使用指南
2014/12/29 Javascript
jQuery插件jRumble实现网页元素抖动
2015/06/05 Javascript
使用postMesssage()实现跨域iframe页面间的信息传递方法
2016/03/29 Javascript
使用jQuery制作Web页面遮罩层插件的实例教程
2016/05/26 Javascript
JS设置CSS样式的方式汇总
2017/01/21 Javascript
原生js实现对Ajax的封装(仿jquery)
2017/01/22 Javascript
微信小程序开发中的疑问解答汇总
2017/07/03 Javascript
vue 里面使用axios 和封装的示例代码
2017/09/01 Javascript
vue-cli中打包图片路径错误的解决方法
2017/10/26 Javascript
Vue中的混入的使用(vue mixins)
2018/06/01 Javascript
element-ui 关于获取select 的label值方法
2018/08/24 Javascript
从零搭一个自用的前端脚手架的方法步骤
2019/09/23 Javascript
介绍Python中几个常用的类方法
2015/04/08 Python
Python常用随机数与随机字符串方法实例
2015/04/09 Python
Python 安装setuptools和pip工具操作方法(必看)
2017/05/22 Python
Python模拟登陆实现代码
2017/06/14 Python
Python3基础教程之递归函数简单示例
2019/06/07 Python
浅谈pytorch grad_fn以及权重梯度不更新的问题
2019/08/20 Python
Python Opencv提取图片中某种颜色组成的图形的方法
2019/09/19 Python
区分python中的进程与线程
2020/08/13 Python
大唐电信科技股份有限公司java工程师面试经历
2016/12/09 面试题
Android面试宝典
2013/08/06 面试题
CAD制图设计师自荐信
2014/01/29 职场文书
校园学雷锋活动月总结
2014/03/09 职场文书
通用自荐信范文
2014/03/14 职场文书
抵押贷款承诺书
2014/05/30 职场文书
困难补助申请报告
2015/05/19 职场文书
2015年会计人员工作总结
2015/05/22 职场文书
2015年音乐教学工作总结
2015/07/22 职场文书
2016教师校本培训心得体会
2016/01/08 职场文书