select2切换事件如何生效
1、问题背景
利用select2生成可搜索下拉框,并且绑定切换事件;但是直接绑定change事件,发现不起作用
2、问题原因
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>select2切换事件</title> <link rel="stylesheet" href="../css/select2.css" /> <script src="../js/jquery-3.2.1.js"></script> <script src="../js/select2.js"></script> <script> $(function(){ $("#selData").select2(); $("#selData").off().on("change",function(){ var data = $(this).val(); alert(data); }); }); </script> </head> <body> <div> <select id="selData" class="js-example-basic-single" style="width:300px;"> <option value=""></option> <option value="1">李四</option> <option value="2">王武</option> <option value="3">华章</option> <option value="4">司徒</option> <option value="5">朝华</option> <option value="6">沈磊</option> </select> </div> </body> </html>
上述代码,下拉搜索框切换事件直接使用change,发现选中的值不能回填到框中
3、解决办法
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>select2切换事件</title> <link rel="stylesheet" href="../css/select2.css" /> <script src="../js/jquery-3.2.1.js"></script> <script src="../js/select2.js"></script> <script> $(function(){ $("#selData").select2(); $("#selData").on("select2:select",function(){ var data = $(this).val(); alert(data); }); }); </script> </head> <body> <div> <select id="selData" class="js-example-basic-single" style="width:300px;"> <option value=""></option> <option value="1">李四</option> <option value="2">王武</option> <option value="3">华章</option> <option value="4">司徒</option> <option value="5">朝华</option> <option value="6">沈磊</option> </select> </div> </body> </html>
将change换成select2:select,这样下拉搜索框可以回填值了
select2切换事件如何生效的更多相关文章
- jq点击事件不生效,效果只闪现一次又立马消失的原因?
出现的问题:jq点击事件不生效,点击的时候效果实现但又立马消失,页面重新刷新了一次 可能出现的原因: a标签href属性的原因,虽然点击事件生效,但页面又刷新了一次,所以没有效果,只闪了一次 解决方案 ...
- jq点击事件未生效
jq点击事件未生效,应写成事件委托的方式 // $(function(){ // $('.current a').on("click", function(){ // $(this ...
- JS -判断、监听屏幕横竖屏切换事件
通过监听window.orientationchange事件,当横竖屏切换事件时触发 <!doctype html> <html> <head> <title ...
- Safair 浏览器cllick事件不生效或者需要双击才生效
针对Safair 浏览器cllick事件不生效或者需要双击才生效的解决方案. 方法一:给元素加上cursor: pointer样式.(不生效) 方法二:ios事件机制不一样,将click事件改为mou ...
- C# tabconctrol切换事件
tabconctrol没有click事件,切换page时,调用SelectedIndexChanged事件: private void tabControl1_SelectedIndexChanged ...
- 为什么Jquery对input file控件的onchange事件只生效一次
今天在做jquery对input file控件的onchange事件进行监听,就一直只生效一次,不知道Jquery为什么对file控件没有做到每次改变触发onchange事件的效果,但是还是有好几种解 ...
- IOS设备上给body绑定click事件不生效及其解决办法
事件背景: 最近在做一个移动端业务的时候碰到一个bug,在ios上对body绑定click事实现事件代理冒泡至某些元素上尽然不生效. 思考: 暂借助jquery展示下事件绑定代码,将所有标签含有dat ...
- 解决Android 7.0 App内切换语言不生效的问题
Android7.0及以前版本,Configuration中的语言相当于是App的全局设置: public static void changeAppLanguage(Context context, ...
- 小程序的tab切换事件
index.wxml代码 <view class="tab-left" > <view " bindtap="tab">tab ...
随机推荐
- 20145322第四周JAVA程序设计基础学习总结
20145322 <Java程序设计>第4周学习总结 教材学习内容总结 第六章 一.继承共同行为 何谓继承 1 多个类中存在相同属性和行为时,将这些内容抽取到单独一个类中,那么多个类无需再 ...
- Btrace使用入门
1.什么是BTrace BTrace是sun公司推出的一款Java 动态.安全追踪(监控)工具,可以在不用重启的情况下监控系统运行情况,方便的获取程序运行时的数据信息,如方法参数.返回值.全局变量和堆 ...
- logstash在Windows2008简单配置实例
Windows2008 安装java1.8,配置系统环境变量: 官方下载并安装略...然后配置 logstash的配置文件 注意PATH路径名称不支持中文 input { file { type =& ...
- mybatis中的懒加载
知识点:mybatis中的懒加载的使用 参考:https://www.cnblogs.com/ysocean/p/7336945.html?utm_source=debugrun&utm_me ...
- LeetCode—— Partition Equal Subset Sum
Question Given a non-empty array containing only positive integers, find if the array can be partiti ...
- AngularJS Injector和Service的工作机制
要了解angularJS里的injector和Service是如何工作的,需要阅读/src/auto/injector.js.另外要结合/src/loader.js才能明白它的应用场景. auto/i ...
- 经典C#面试题
1.在下面的代码中,如何引用命名空间fabulous中的great? namespace fabulous{// code in fabulous namespace}namespace super{ ...
- 从Github上轻松安装R包—githubinstall包--转载
1.综述 越来越多的R包正在由世界上不同的人所创建,其中一部分原因是devtools包使得开发R包1变得更加简单.devtools包不仅让开发R包变得简单,而且用于分发R包. 当开发者发布一个R包的时 ...
- wamp升级php7
原文:http://blog.csdn.net/cheng6251/article/details/50730441 1.下载php7 http://windows.PHP.net/downloa ...
- 基于usb4java实现的java下的usb通信
项目地址:点击打开 使用java开发的好处就是跨平台,基本上java的开发的程序在linux.mac.MS上都可以运行,对应这java的那句经典名言:一次编写,到处运行.这个项目里面有两种包选择,一个 ...