Bootstrap3 模态框 select2搜索框无法输入
<div class="modal fade" role="dialog" aria-hidden="true" data-backdrop="static">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title">Modal title</h4>
</div>
<div class="modal-body">
<p>One fine body…</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
用modal来show一个对话框
dialog.modal({
backdrop:true,
keyboard:true,
show:true
});
然后再modal中初始化select2
dialog.find("select").select2({
formatNoMatches: function() {
return "没有选项";
},
placeholder: "请选择...",
minimumResultsForSearch: 0,
allowClear: false
});
这时候select2的搜索框无法输入,一般有两方面的原因
1.检查下modal的div中是否有tabindex=”-1”,这个属性
<div class="modal fade in" id="dialog-new-draft">
2.js代码中加入
$.fn.modal.Constructor.prototype.enforceFocus = function () {};
在本文中的模态框是bootstrap的模态框,目前3版本的模态框已经验证通过。
Bootstrap3 模态框 select2搜索框无法输入的更多相关文章
- Bootstrap 模态框 select2搜索框无法输入
去掉模态框的div中的 tabindex="-1" 这个属性 <div class="modal fade" role="dialog" ...
- 在BootStrap的modal中使用Select2搜索框无法输入
用modal来show一个对话框 dialog.modal({ backdrop:true, keyboard:true, show:true }); 1 2 3 4 5 然后再modal中初始化se ...
- select2搜索框查询加遍历
<div class="form-group"> <label class="control-label col-sm-1 no-padding-rig ...
- yii2 shi用modal弹窗 select2搜索框无法使用
在modal使用begin的时候指定options选项的tabindex为false Modal::begin([ // ...... 'options' => [ 'tabindex' =&g ...
- js之搜索框
目标效果:点击搜索框,搜索框内提示信息消失,可输入搜索信息,点击搜索框外搜索框如果没提示信息或者为空时,显示搜索框提示信息,如果有搜索信息,显示搜索信息. 代码如下: <!DOCTYPE htm ...
- React后台管理系统-商品列表搜索框listSearch组件
1.商品列表搜索框 2.搜索框页面的结构为 <div className="row search-wrap"> <div classN ...
- extjs在窗体中添加搜索框
在extjs中添加搜索框,搜索框代码如下: this.searchField = new Ext.ux.form.SearchField({ store : this.store ...
- Android UI(五)云通讯录项目之联系人列表,带侧滑选择,带搜索框
作者:泥沙砖瓦浆木匠网站:http://blog.csdn.net/jeffli1993个人签名:打算起手不凡写出鸿篇巨作的人,往往坚持不了完成第一章节.交流QQ群:[编程之美 365234583]h ...
- 开发手机APP过程,不同使用场景APP搜索框的样式及区别
搜索框是 app 内最常见的控件之一,可以帮助用户快速又精准找到期望的内容与功能.不同的使用场景下,根据页面中搜索的重要程度,搜索框也有着不同的样式. 下面就常州开发APP公司和大家聊聊常见的四种样式 ...
随机推荐
- Tutorial 01_熟悉常用的Linux操作和Hadoop操作
(一)熟悉常用的Linux 操作cd 命令:切换目录 (1) 切换到目录“/usr/local” (2) 切换到当前目录的上一级目录 (3) 切换到当前登录Linux 系统的用户的自己的主文件夹 ...
- ST表
ST表的原理及其实现 ST表类似树状数组,线段树这两种算法,是一种用于解决RMQ(Range Minimum/Maximum Query,即区间最值查询)问题的离线算法 与线段树相比,预处理复杂度同为 ...
- Ubuntu16.04安装TensorFlow及Mnist训练
版权声明:本文为博主原创文章,欢迎转载,并请注明出处.联系方式:460356155@qq.com TensorFlow是Google开发的开源的深度学习框架,也是当前使用最广泛的深度学习框架. 一.安 ...
- PHP中高级进阶之路
纯自己总结,认为作为一个中高级的PHP程序员,应该必修的内容,以此鞭策自己,努力向着这个方向前进. 1. 技能自问 1) PHP7开始使用了吗?它的一些新特性? 2) 数据库分库分表的实现 3) My ...
- Linux(Ubuntu 16) 下Java开发环境的配置(三)------Mysql配置
前言 吐槽一句,如果在Ubuntu在默认情况下是只有最新的MySQL源的,即如果使用"sudo apt-get install mysql-server mysql-client " ...
- 访问docker仓库
仓库(Repositiry)是集中存放镜像的地方,分为公共仓库和私有仓库.一个容易与之混淆的概念是注册服务器(Registry).实际上注册服务器是存放仓库的具体服务器,一个注册服务器上可以有多个仓库 ...
- PLSQL:orecal,tnsname简介
导入ORACLE遇到很多问题,学了好多,其中很长时间花在网络配置上,刚开始学,具体原因不知道,先把搜集到的好文章存下来,以后慢慢研究. 监听配置文件 为了使得外部进程 如 CA ...
- MIUI9 解锁并刷入TWRP后,删除解锁密码
如果因为某种原因导致解锁密码失效(比如刷了其他ROM),还原备份回来之后,解锁密码失效了. 那么可以进入TWRP,然后通过 adb shell 进入\data\system\文件夹 用rm命令删除g ...
- windows下零基础gulp构建
在学习前,先谈谈大致使用gulp的步骤,给读者以初步的认识.首先当然是安装nodejs,通过nodejs的npm全局安装和项目安装gulp,其次在项目里安装所需要的gulp插件,然后新建gulp的配置 ...
- Apache Beam实战指南 | 手把手教你玩转大数据存储HdfsIO
https://mp.weixin.qq.com/s?__biz=MzU1NDA4NjU2MA==&mid=2247494843&idx=2&sn=0dd20caec76e25 ...