关于BootStrap modal 在IOS9中不能弹出的解决方法(IOS 9 bootstrap modal ios 9 noticework)


Posted in Javascript onDecember 14, 2016

最近的项目用的bootstrap前端,手机刚刚更新IOS9发现其中的modal有个bug,首页点弹出框会出现问题,找了好多资料终于找到解决办法。在CSS中加入以下代码

CSS

body { 
 padding-right: 0px !important 
} 
.modal-open { 
 overflow-y: auto; 
}

PS:bootstrap datepicker 在bootstrap modal中不显示问题

可以通过在 input 输入框之外 嵌套 <span style="position: relative; z-index: 9999;"> 完美解决问题。

修改前:

<div class="input-group">
  <input type="text" class="form-control date-picker" data-date-format="yyyy-mm-dd" name="contract_date" id="contract_date" value="{{ 'now'|date('Y-m-d') }}">
  <span class="input-group-addon"><i class="fa fa-calendar bigger-110"></i></span>
</div>

修改后:

<div class="input-group">
  <span style="position: relative; z-index: 9999;">
    <input type="text" class="form-control date-picker" data-date-format="yyyy-mm-dd" name="contract_date" id="contract_date" value="{{ 'now'|date('Y-m-d') }}">
  </span>
  <span class="input-group-addon"><i class="fa fa-calendar bigger-110"></i></span>
</div>

以上所述是小编给大家介绍的关于BootStrap modal 在IOS9中不能弹出的解决方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
Javascript 陷阱 window全局对象
Nov 26 Javascript
JQuery 写的个性导航菜单
Dec 24 Javascript
javascript学习笔记(八)正则表达式
Oct 08 Javascript
原生javascript实现图片滚动、延时加载功能
Jan 12 Javascript
2种jQuery 实现刮刮卡效果
Feb 01 Javascript
JavaScript易错知识点整理
Dec 05 Javascript
微信小程序之picker日期和时间选择器
Feb 09 Javascript
微信小程序实战之仿android fragment可滑动底部导航栏(4)
Apr 16 Javascript
使用JavaScrip模拟实现仿京东搜索框功能
Oct 16 Javascript
基于Vue sessionStorage实现保留搜索框搜索内容
Jun 01 Javascript
基于JS实现计算24点算法代码实例解析
Jul 23 Javascript
JavaScript中的几种继承方法示例
Dec 06 Javascript
实例解析angularjs的filter过滤器
Dec 14 #Javascript
微信小程序 input输入框控件详解及实例(多种示例)
Dec 14 #Javascript
javascript中对象的定义、使用以及对象和原型链操作小结
Dec 14 #Javascript
JS中使用new Date(str)创建时间对象不兼容firefox和ie的解决方法(两种)
Dec 14 #Javascript
javascript中的try catch异常捕获机制用法分析
Dec 14 #Javascript
微信小程序 scroll-view组件实现列表页实例代码
Dec 14 #Javascript
AngularJS指令中的绑定策略实例分析
Dec 14 #Javascript
You might like
PHP与javascript对多项选择的处理
2006/10/09 PHP
php遍历所有文件及文件夹的方法深入解析
2013/06/08 PHP
PHP用身份证号获取星座和生肖的方法
2013/11/07 PHP
PHP引用的调用方法分析
2016/04/25 PHP
Laravel使用memcached缓存对文章增删改查进行优化的方法
2016/10/08 PHP
Js 冒泡事件阻止实现代码
2013/01/27 Javascript
jQuery实现平滑滚动到指定锚点的方法
2015/03/20 Javascript
JavaScript中的toDateString()方法使用详解
2015/06/12 Javascript
AngularJS控制器之间的数据共享及通信详解
2016/08/01 Javascript
jQuery实现加入收藏夹功能(主流浏览器兼职)
2016/12/24 Javascript
浅谈javascript中的事件冒泡和事件捕获
2016/12/28 Javascript
jQuery 实现双击编辑表格功能
2017/06/19 jQuery
ReactNative 之FlatList使用及踩坑封装总结
2017/11/29 Javascript
纯js代码生成可搜索选择下拉列表的实例
2018/01/11 Javascript
react-redux中connect的装饰器用法@connect详解
2018/01/13 Javascript
vue.js根据代码运行环境选择baseurl的方法
2018/02/28 Javascript
JS Object.preventExtensions(),Object.seal()与Object.freeze()用法实例分析
2018/08/25 Javascript
关于React动态加载路由处理的相关问题
2019/01/07 Javascript
详解ES6 Promise的生命周期和创建
2019/08/18 Javascript
layui select 禁止点击的实现方法
2019/09/05 Javascript
vue项目引入ts步骤(小结)
2019/10/31 Javascript
在js文件中引入(调用)另一个js文件的三种方法
2020/09/11 Javascript
python3实现ftp服务功能(服务端 For Linux)
2017/03/24 Python
Python hashlib常见摘要算法详解
2020/01/13 Python
Python读取多列数据以及用matplotlib制作图表方法实例
2020/09/23 Python
Python绘制数码晶体管日期
2021/02/19 Python
Scholastic父母商店:儿童书籍
2017/01/01 全球购物
经销商会议欢迎词
2014/01/11 职场文书
写给妈妈的道歉信
2014/01/11 职场文书
优秀中学生事迹材料
2014/01/31 职场文书
任命书模板
2014/06/04 职场文书
动物科学专业求职信
2014/07/27 职场文书
爱牙日活动总结
2014/08/29 职场文书
学习三严三实对照检查材料思想汇报
2014/09/22 职场文书
乡镇三严三实学习心得体会
2014/10/13 职场文书
文明礼仪主题班会
2015/08/13 职场文书