bootStrap模态框与select2合用时input不能获取焦点、模态框内部滑动,select选中跳转
bootStrap模态框与select2合用时input不能获取焦点
在bootstrap的模态框里使用select2插件,会导致select2里的input输入框没有办法获得焦点,没有办法输入.
- 把页面中的 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">
- 重写enforceFocus方法:(测试可用)
保证他能被执行到就行
模态框内部滑动
不使用页面的滚动条
css:给模态框设置overflow-y: hidden;即为取消掉页面滚动条的使用
#HelpModal{margin-top: 95px;height: 300px;overflow-y: hidden;}
添加滚动条,添加滚动条的位置不同效果不同
.modal-content {overflow: auto;max-height:300px;}
html:模态框最外层设置id属性的overflow-y: hidden;,权重值高于自定义的.modal-open .modal类名设置的overflow-y: auto;
select选中跳转
select2选中事件
$(".demo").on("select2:select",function(e){
console.log(e);
})
**跳转到本页面中指定位置 **
document.getElementById(‘uuuu’).scrollIntoView()
官网select2事件介绍
bootStrap模态框与select2合用时input不能获取焦点、模态框内部滑动,select选中跳转的更多相关文章
- bootstrap模态框和select2合用时input无法获取焦点
在bootstrap的模态框里使用select2插件,会导致select2里的input输入框没有办法获得焦点,没有办法输入. 解决方法: 1. 把页面中的 tabindex="-1&qu ...
- bootstrap模态框和select2合用时input无法获取焦点(转)
在bootstrap的模态框里使用select2插件,会导致select2里的input输入框没有办法获得焦点,没有办法输入. 解决方法: 1. 把页面中的 tabindex="-1&qu ...
- Bootstrap modal模态框关闭时,combobox input下拉框仍然保留在页面上
问题描述: 当点击模态框的关闭按钮时,下拉框中的内容没有消失,而是移动到了页面左上角 分析:这个问题的定位在于是用的哪种模态框,bootstrap和easyui都可以实现模态框,但是两个方法实现的模态 ...
- Bootstrap入门(二十三)JS插件1:模态框
Bootstrap入门(二十三)JS插件1:模态框 1.静态实例 2.动态实例 3.模态框的尺寸和效果 4.包含表单的模态框 模态框经过了优化,更加灵活,以弹出对话框的形式出现,具有最小和最实用的功能 ...
- bootstrap3中select2的默认值和下拉框的禁用
最近做项目用到了select2插件,需求中需要给下拉框设置默认值之后,禁用下拉框,我开始的写法是这样的 <script type="text/javascript"> ...
- html5与js关于input[type='text']文本框value改变触发事件一些属性的区别oninput,onpropertychange,onchange和文本框的value点击全选状态onclick="select();"。做购物车页面时会要用到。
关于input[type='text']文本框value改变触发事件一些属性的区别oninput,onpropertychange,onchange和文本框的点击全选状态onclick="s ...
- Bootstrap入门(三十)JS插件7:警告框
Bootstrap入门(三十)JS插件7:警告框 通过这个插件可以为警告信息添加点击以及消失的功能. 当使用一个.close按钮,它必须是第一个子元素.alert-dismissible,并没有文字内 ...
- html中如何修改选中 用input做的搜索框 的边框颜色
html中如何修改选中 用input做的搜索框 的边框颜色 如图,当我鼠标选中输入框时,内边框会变成蓝色 我的问题是: 1.如何把蓝色去掉? 2.如何改成别的颜色? 首先感谢 UI设计师提出的需求,解 ...
- input标签(单选框和复选框)
单选框: <form> <input type="radio" name="..." value="..." checke ...
随机推荐
- 00JAVA语法基础_四则运算 01
自动生成30道四则运算的数学题,当前只是简单符合出题,答题和判断的代码,还没做要求,所以现在只是能随机生成三十道100以内的加减法和九九乘法表的乘除法 package Sizeyunsuan; /** ...
- 「干货」面试官问我如何快速搜索10万个矩形?——我说RBush
「干货」面试官问我如何快速搜索10万个矩形?--我说RBUSH 前言 亲爱的coder们,我又来了,一个喜欢图形的程序员,前几篇文章一直都在教大家怎么画地图.画折线图.画烟花,难道图形就是这样嘛,当 ...
- 微信小程序云开发-云函数-创建云函数
一.检查云函数环境 检查云函数环境时候,鼠标右键点击查看当前环境.如果存在多个云开发环境,要确保云函数的当前环境要与app.js中evn的环境值一致. 如果不一致,则鼠标右键切换当前云开发环境.(如果 ...
- 以初学者的角度理解:SQL实现关系除法
以初学者的角度理解:SQL实现关系除法 相信各位在学习SQL的时候,由于没有一家SQL语言提供除法命令而只能自己写一个.而网上大多就是四步骤加一个模板: select distinct A.X fro ...
- P6295 有标号 DAG 计数
P6295 有标号 DAG 计数 题意 求 \(n\) 个点有标号弱联通 DAG 数量. 推导 设 \(f_i\) 表示 \(i\) 个点有标号 DAG 数量(不保证弱联通),有: \[f(i)=\s ...
- python安装pyeda库--windows版
本页介绍了如何购买自己的PyEDA闪亮副本.PyEDA项目的主要目标是成为主流的Python软件包,并遵守社区中遵守的大多数约定. 支持平台 PyEDA支持Windows以及任何带有C编译器的平台.作 ...
- VB 6.0不能加载MSCOMCTL.OCX的解决方法
问题场景:打开 VB 6项目时报错,不能加载 'C:\WINDOWS\system32\MSCOMCTL.OCX'--继续加载工程吗? 解决方法: 1.新建一个VB工程,然后按CTRL + T,选中 ...
- REM 根据卷标搜索随身固态U盘的盘符.BAT
REM 根据卷标搜索随身固态U盘的盘符.BAT@echo offfor /f "tokens=2 delims==" %%a in ('wmic logicaldisk where ...
- 精进 Spring Boot 03:Spring Boot 的配置文件和配置管理,以及用三种方式读取配置文件
精进 Spring Boot 03:Spring Boot 的配置文件和配置管理,以及用三种方式读取配置文件 内容简介:本文介绍 Spring Boot 的配置文件和配置管理,以及介绍了三种读取配置文 ...
- burp暴力破解之md5和绕过验证码
Burpsuite是一个功能强大的工具,也是一个比较复杂的工具 本节主要说明一下burp的intruder模块中的2个技巧 1.md5加密 我们在payload Processing中的add选项可以 ...