关于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 相关文章推荐
浅析jquery ajax异步调用方法中不能给全局变量赋值的原因及解决方法
Jan 10 Javascript
基于Jquery实现键盘按键监听
May 11 Javascript
JQuery限制复选框checkbox可选中个数的方法
Apr 20 Javascript
APP中javascript+css3实现下拉刷新效果
Jan 27 Javascript
jQuery的 $.ajax防止重复提交的两种方法(推荐)
Oct 14 Javascript
JS获取多维数组中相同键的值实现方法示例
Jan 06 Javascript
JS验证不重复验证码
Feb 10 Javascript
vue slot 在子组件中显示父组件传递的模板
Mar 02 Javascript
webpack中如何加载静态文件的方法步骤
May 18 Javascript
在 Vue 应用中使用 Netlify 表单功能的方法详解
Jun 03 Javascript
微信小程序 扭蛋抽奖机css3动画实现详解
Jul 19 Javascript
Vue使用screenfull实现全屏效果
Sep 17 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 格式化数字的时候注意数字的范围
2010/04/13 PHP
php自动加载机制的深入分析
2013/06/08 PHP
PHP实现微信网页授权开发教程
2016/01/19 PHP
简单谈谈PHP中的Reload操作
2016/12/12 PHP
PHPStorm2020.1永久激活及下载更新至2020(推荐)
2020/09/25 PHP
js操作checkbox遇到的问题解决
2013/06/29 Javascript
raphael.js绘制中国地图 地图绘制方法
2014/02/12 Javascript
JS中的THIS和WINDOW.EVENT.SRCELEMENT详解
2015/05/25 Javascript
JavaScript中计算网页中某个元素的位置
2015/06/10 Javascript
javascript实现拖放效果
2015/12/16 Javascript
Bootstrap3制作图片轮播效果
2016/05/12 Javascript
早该知道的7个JavaScript技巧
2016/06/21 Javascript
flexslider.js实现移动端轮播
2017/02/05 Javascript
深入探究AngularJs之$scope对象(作用域)
2017/07/20 Javascript
ionic3+Angular4实现接口请求及本地json文件读取示例
2017/10/11 Javascript
layui点击数据表格添加或删除一行的例子
2019/09/12 Javascript
[02:05]2014DOTA2西雅图邀请赛 老队长全明星大猜想谁不服就按进显示器
2014/07/08 DOTA
利用Python操作消息队列RabbitMQ的方法教程
2017/07/19 Python
Python txt文件加入字典并查询的方法
2019/01/15 Python
Python人脸识别第三方库face_recognition接口说明文档
2019/05/03 Python
Django接收自定义http header过程详解
2019/08/23 Python
Python读写锁实现实现代码解析
2020/11/28 Python
html5中svg canvas和图片之间相互转化思路代码
2014/01/24 HTML / CSS
德国化妆品和天然化妆品网上商店:kosmetikfuchs.de
2017/06/09 全球购物
EJB2和EJB3在架构上的不同点
2014/09/29 面试题
银行柜员应聘推荐信范文
2013/11/24 职场文书
四川成都导游欢迎词
2014/01/18 职场文书
增员口号大全
2014/06/18 职场文书
科技工作者先进事迹
2014/08/16 职场文书
反洗钱宣传活动总结
2014/08/26 职场文书
院党委组织查摆问题对照检查材料思想汇报2014
2014/10/08 职场文书
2014年保卫部工作总结
2014/11/21 职场文书
2014年底个人工作总结
2015/03/10 职场文书
庆祝教师节新闻稿
2015/07/17 职场文书
详解Vue slot插槽
2021/11/20 Vue.js
SQLyog的下载、安装、破解、配置教程(MySQL可视化工具安装)
2022/09/23 MySQL