在bootstrap的模态框里使用select2插件,会导致select2里的input输入框没有办法获得焦点,没有办法输入.

解决方法:

1.

把页面中的  tabindex="-1"  删掉(测试成功):

<div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h3 id="myModalLabel">Panel</h3>
</div>
<div class="modal-body" style="max-height: 800px">
<div id="myModal" class="modal hide fade" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h3 id="myModalLabel">Panel</h3>
</div>
<div class="modal-body" style="max-height: 800px">

可以在onshown方法里面做处理,主要原理就是因为bootstrap的tabindex='-1',占用了select2的tabindex='0',脚本做处理 模态框显示出来后,将模态框的tabindex属性删掉

BootstrapDialog.show({

     onshown: function (dialogRef) {

        $("#"+dialogRef.getId()).removeAttr("tabindex");
}
})

  

2.

重写enforceFocus方法(测试发现没有效果):

$.fn.modal.Constructor.prototype.enforceFocus = function() {};

  

转发请标注原文地址:http://www.cnblogs.com/dinglinjie/p/7462228.html

  阿杰de博客,qq群:112465270



bootstrap模态框和select2合用时input无法获取焦点(转)的更多相关文章

  1. bootStrap模态框与select2合用时input不能获取焦点、模态框内部滑动,select选中跳转

    bootStrap模态框与select2合用时input不能获取焦点 在bootstrap的模态框里使用select2插件,会导致select2里的input输入框没有办法获得焦点,没有办法输入. 把 ...

  2. bootstrap模态框和select2合用时input无法获取焦点

    在bootstrap的模态框里使用select2插件,会导致select2里的input输入框没有办法获得焦点,没有办法输入. 解决方法: 1. 把页面中的  tabindex="-1&qu ...

  3. select2和bootstrap模态框一起使用导致select2的input获取不到焦点问题

      select2和bootstrap模态框一起使用导致select2的input获取不到焦点问题 解决办法: 把页面中的 tabindex="-1" 删掉, 或者值改为1 代码片 ...

  4. bootstrap模态框input不能获取焦点并编辑【转】

    Bootstrap模态框时input标签[日期控件也有这样的问题]不能编辑的问题,下面是我的解决方法: 1.将下图中框出来的属性删掉即可: 2.兼容火狐浏览器,笔者在火狐中还是不能编辑,去掉下图属性即 ...

  5. 解决display none到display block 渲染时间过长的问题,以及bootstrap模态框导致其他框中input不能获得焦点问题的解决

    在做定制页面的时候,遇到这么一个问题,因为弹出框用的是bootstrap的自带的弹出框,控制显示和隐藏也是用自带的属性控制 控制显示,在触发的地方 例如botton上面加上 data-toggle=& ...

  6. bootstrap 模态框中弹出层 input不能获得焦点且不可编辑

    bootstrap 模态框中弹出层 input不能获得焦点且不可编辑 问题描述:bs框架支持一层model层的情况下,在模态框中弹出了自定义的弹出层.发现自定义弹出层的输入框不能获得焦点且不可编辑. ...

  7. 解决bootstrap模态框内输入框无法获取焦点

    bootstrap 模态框中的input标签在某些情况下会无法获取焦点. 最终解决方法:去除模态框的 tabindex="-1" 属性即可

  8. bootstrap模态框关闭后清除模态框的数据

    https://segmentfault.com/q/1010000008789123 bootstrap模态框第二次打开时如何清除之前的数据? 我用了bootstrap模态框的remote功能,在弹 ...

  9. 第二百四十三节,Bootstrap模态框插件

    Bootstrap模态框插件 学习要点: 1.基本使用 2.用法说明 本节课我们主要学习一下 Bootstrap 中的模态框插件,这是一款交互式网站非常常见的 弹窗功能插件. 一.基本使用 使用模态框 ...

随机推荐

  1. linux环境图数据库neo4j安装

    自定义yum源 Neo4j Stable Yum Repo First, you'll want our key: cd /tmp wget http://debian.neo4j.org/neote ...

  2. 使用PHP操作MongoDB数据库

    1.连接MongoDB数据库(在已安装php-mongodb扩展的前提下) $config = "mongodb://{$user}:{$pass}@{$host}:{$port}" ...

  3. Git 基础教程 之 标签

    所谓标签:就是一个让人容易记住的有意义的名字,与某个commit绑在一起. 创建标签:①切回需要打标签的分支上                  ② git tag <name>  默认标 ...

  4. JavaSE 学习笔记之Import 导入(十二)

    Import - 导入:类名称变长,写起来很麻烦.为了简化,使用了一个关键字:import,可以使用这个关键字导入指定包中的类.记住:实际开发时,到的哪个类就导入哪个类,不建议使用*. import ...

  5. noip模拟赛 同余方程组

    分析:这道题一个一个枚举都能有70分...... 前60分可以用中国剩余定理搞一搞.然而并没有枚举分数高......考虑怎么省去不必要的枚举,每次跳都只跳a的倍数,这样对前面的式子没有影响,为了使得这 ...

  6. nyoj_366_D的小L_201403011600

    D的小L 时间限制:4000 ms  |  内存限制:65535 KB 难度:2   描述       一天TC的匡匡找ACM的小L玩三国杀,但是这会小L忙着哩,不想和匡匡玩但又怕匡匡生气,这时小L给 ...

  7. POJ 1190 生日蛋糕 剪枝

    Description 7月17日是Mr.W的生日,ACM-THU为此要制作一个体积为Nπ的M层生日蛋糕,每层都是一个圆柱体. 设从下往上数第i(1 <= i <= M)层蛋糕是半径为Ri ...

  8. http-runtime属性

    配置httpRuntime也可以让FileUpload上传更大的文件,不过设置太大了会因用户将大量文件传递到该服务器而导致的拒绝服务攻击(属性有说明) 属性 属性 选项 说明 appRequestQu ...

  9. linux系统读写缓存

    1.  操作系统缓存 在linux世界里,一切可读写设备都可看作是文件.文件cache设计的好坏直接影响着文件系统和磁盘的性能.最直观的是使用free命令看到的cached列. 这里面的cached列 ...

  10. iOS: 将OC的NSMutableArray转为Swift的Array

    一句话: YourSwiftObject convertedArray = your_MutableArray as NSArray as [YourSwiftObject]