解决二级模态框关闭后,遮罩阴影依然存在,导致页面无法操作的BUG
2017-12-12 21:51
639 查看
在项目后台中由于需要展示二级模态框,在点击关闭二级模态框(弹出框)的时候出现了遮罩阴影依然存在,导致页面呈现暗灰色,无法操作的现象效果图如下:
出现改问题的原因是:由于点击“关闭”按钮或点击模态框右上角的“X”或点击模态框右边的空白处,会使两层或多层模态框同时关闭,但是modal自己生成的遮罩层只关闭了一个,其他的依然存在,因此导致遮罩阴影覆盖原有页面,导致无法操作页面。
解决问题的方法:(1)当最外层的modal关闭后,手动删除所有的遮罩层:$("#soldier-modal”).remove()
(2)让modal一层一层关闭,避免出现一次关闭多层的情况 $("#soldier-modal").modal({show:true, backdrop:'static'});
问题总结: 这些问题所涉及到的都是些前端的知识,是bootstrap中的模态框的应用。
出现改问题的原因是:由于点击“关闭”按钮或点击模态框右上角的“X”或点击模态框右边的空白处,会使两层或多层模态框同时关闭,但是modal自己生成的遮罩层只关闭了一个,其他的依然存在,因此导致遮罩阴影覆盖原有页面,导致无法操作页面。
解决问题的方法:(1)当最外层的modal关闭后,手动删除所有的遮罩层:$("#soldier-modal”).remove()
(2)让modal一层一层关闭,避免出现一次关闭多层的情况 $("#soldier-modal").modal({show:true, backdrop:'static'});
问题总结: 这些问题所涉及到的都是些前端的知识,是bootstrap中的模态框的应用。
相关文章推荐
- defer属性导致引用JQuery的页面报“浏览器无法打开网站xxx,操作被中止”错误的解决方法
- Boostrap 二级模态框关闭后导致一级模态框无法滚动
- defer属性导致引用JQuery的页面报“浏览器无法打开网站xxx,操作被中止”错误的解决方法
- defer属性导致引用JQuery的页面报“浏览器无法打开网站xxx,操作被中止”错误的解决方法
- eclipse在异常关闭后,导致无法启动workspace问题的解决
- 解决因为手机设置字体大小导致h5页面在webview中变形的bug
- Bootstrap的模态框遮罩在iframe子页面弹出时不能覆盖父页面的解决方法
- Ubuntu安装界面下方无法显示问题,导致无法操作解决办法
- iOS解决使用模态视图 导致无法pushViewController
- layer弹窗iframe页面,关闭弹窗方法导致form表单无法提交到服务器
- jmeter压测发送json报文中存在转义字符并参数化了某些变量导致发送至服务器端报文无法处理的解决
- jenkins配置权限不对导致无法登陆或者空白页面解决办法
- Android无法导入下载好的项目(和Eclipse中已经存在的项目命名一样导致冲突)解决办法
- 解决因为手机设置字体大小导致h5页面在webview中变形的BUG
- yum因被锁定导致无法执行相关操作的解决方法
- myeclipse异常关闭导致tomcat无法启动如何解决
- [IIS] 测试的产品登陆之后有个引用外部站点js的请求半天都无法返回,导致网页一直在打转,Selenium的driver也无法对页面进行下一步的操作
- 压测xx业务数据库资源大量等待,存在表锁问题,导致数据库无法正常执行解决办法
- 解决jquery.tmpl.js的BUG,页面上存在与${key}键值相同的id名,则出现object HTMLInputElement之类的默认值
- Mysql+hibernate 长时间不操作再进入,导致连接池关闭的问题解决。