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公司和大家聊聊常见的四种样式 ...
随机推荐
- vue 中使用jquery
vue-cli搭建的项目 第一种方式:npm 引包的方式 1.安装jquery npm install jquery --save 2.webpack配置 在项目根目录下的build目录下找到webp ...
- Activiti开发案例之activiti-app更换数据源
前言 由于Activiti 默认使用的数据库是H2数据库,重启服务后相关数据会丢失.为了永久保存,所以要配置关系型数据库,这里我们选择 SqlServer ,有钱任性. 环境 Activiti6,Sq ...
- 1 vmware 如何联网,以及行命令令初步
VMware安装Linux(我安装的是ubuntu),没法上网,上网教程见:https://blog.csdn.net/qq_28090573/article/details/78730552 安装完 ...
- XSS原理及防范
Xss(cross-site scripting)攻击指的是攻击者往Web页面里插入恶意html标签或者javascript代码.比如:攻击者在论坛中放一个看似安全的链接,骗取用户点击后,窃取cook ...
- Ubuntu 系统安装详解 19.04最新版本
Ubuntu 19.04版本系统安装详解 1 .镜像的下载 推荐 阿里云镜像下载 2.安装 1.1.新建虚拟机 注意硬件的兼容性问题 当前只有5.x可以用,其他兼容各位可以尝试下,我也都试过,但只有5 ...
- sql sever基本命令
创建表: create table stu_info( id ,) not null primary key clustered, name ) not null, score numeric not ...
- 使用mysql将手机号、身份证号等字段进行脱敏
-- 脱敏姓名 UPDATE wb_person_message SET `name`=(if(LENGTH(name)>6,CONCAT(LEFT(name,1), '**' ),CONCAT ...
- Django contenttypes组件
contenttypes组件 介绍 Django包含一个contenttypes应用程序(app),可以跟踪Django项目中安装的所有模型(Model),提供用于处理模型的高级通用接口. Conte ...
- STM32的IO口是如何配置为某个外设使用的 ---?
@2019-03-01 [猜想] 使用片内外设功能: 首先将对应 IO 口配置为复用输出 其次是 IO 口对应的多个功能外设,哪个外设使能即将外设与 IO 口相连 [疑问] 若多个外设都使能,那么到底 ...
- LoadRunner开发ftp协议接口之上传文件脚本
Action() { //建立一个ftp对象 FTP ftp1=0; //建立FTP连接并登录 ftp_logon_ex(&ftp1,"ftpLogon", "U ...