关于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 1.3.2 IE8中的一点点的小问题解决方法
Jul 10 Javascript
jquery内置验证(validate)使用方法示例(表单验证)
Dec 04 Javascript
JS小游戏之宇宙战机源码详解
Sep 25 Javascript
JavaScript生成二维码图片小结
Dec 27 Javascript
JavaScript中数组去除重复的三种方法
Apr 22 Javascript
AngularJS入门教程之模块化操作用法示例
Nov 02 Javascript
JavaScript提高加载和执行效率的方法
Feb 03 Javascript
AngularJS与BootStrap模仿百度分页的示例代码
May 23 Javascript
微信小程序如何播放腾讯视频的实现
Sep 20 Javascript
vue项目使用.env文件配置全局环境变量的方法
Oct 24 Javascript
VUE渲染后端返回含有script标签的html字符串示例
Oct 28 Javascript
关于element-ui表单中限制输入纯数字的解决方式
Sep 08 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实现Mysql简易操作类
2015/10/11 PHP
PHP 中魔术常量的实例详解
2017/10/26 PHP
Laravel数据库读写分离配置的方法
2019/10/13 PHP
如何使用Javascript获取距今n天前的日期
2013/07/08 Javascript
node.js入门教程迷你书、node.js入门web应用开发完全示例
2014/04/06 Javascript
jQuery简单实现日历的方法
2015/05/04 Javascript
jQuery实现仿美橙互联两级导航菜单效果完整实例
2015/09/17 Javascript
javascript实现瀑布流加载图片原理
2016/02/02 Javascript
JS和jQuery使用submit方法无法提交表单的原因分析及解决办法
2016/05/17 Javascript
js canvas仿支付宝芝麻信用分仪表盘
2016/11/16 Javascript
JavaScript面试题(指针、帽子和女朋友)
2016/11/23 Javascript
原生js的ajax和解决跨域的jsonp(实例讲解)
2017/10/16 Javascript
vue使用keep-alive保持滚动条位置的实现方法
2019/04/09 Javascript
jQuery实现简单评论区功能
2020/10/26 jQuery
Python新手实现2048小游戏
2015/03/31 Python
在Python操作时间和日期之asctime()方法的使用
2015/05/22 Python
Python在线运行代码助手
2016/07/15 Python
解决使用PyCharm时无法启动控制台的问题
2019/01/19 Python
Python查找最长不包含重复字符的子字符串算法示例
2019/02/13 Python
CentOS6.9 Python环境配置(python2.7、pip、virtualenv)
2019/05/06 Python
基于python的itchat库实现微信聊天机器人(推荐)
2019/10/29 Python
Selenium及python实现滚动操作多种方法
2020/07/21 Python
解决Django响应JsonResponse返回json格式数据报错问题
2020/08/09 Python
Django集成MongoDB实现过程解析
2020/12/01 Python
使用JS+CSS3技术:让你的名字动起来
2013/04/27 HTML / CSS
使用css3实现超炫的loading加载动画效果
2014/05/07 HTML / CSS
史蒂夫·马登加拿大官网:Steve Madden加拿大
2017/11/18 全球购物
总经理助理岗位职责
2013/11/08 职场文书
《大自然的语言》教学反思
2014/04/08 职场文书
大一新生期末自我评价
2014/09/12 职场文书
三严三实学习心得体会
2014/10/13 职场文书
幼儿园欢迎词范文
2015/01/26 职场文书
2015年扫黄打非工作总结
2015/05/13 职场文书
优秀共产党员主要事迹材料
2015/11/05 职场文书
Python Numpy库的超详细教程
2022/04/06 Python
Win11右下角图标点了没反应怎么办?Win11点击右下角图标无反应解决方法汇总
2022/07/07 数码科技