这里也会遇到一次性关闭所有modal引起阴影遮罩的问题,也就是所有modal都关闭了,但是主页面仍然被阴影遮罩.

这个问题从哪来的,是因为modal叠加,我们点击窗口之外的空白部分,一次性关闭所有model,但是modal自己生成的'.modal-backdrop'只关闭了一个,其余的依然存在, 导致阴影遮罩.

这里的解决办法是

1.第一种禁用modal 点击空白自动关闭的功能。

tempModal.modal({
backdrop:"static"
})

也就是只能点击关闭按钮,一层一层关闭,避免发生多层关闭的问题。

2.第二种在最外层的modal关闭时,手动删除所有遮罩

$("#tempModal").bind('hide.bs.modal',function(){
$(".modal-backdrop").remove();
})

这里好处是,保留了点击空白自动关闭的功能

Bootstrap modal 多弹窗之叠加关闭阴影遮罩问题的解决方法的更多相关文章

  1. 在bootstrap modal 中加载百度地图的信息窗口失效解决方法

    这个问题其实很傻,解决方法没有任何技术含量,只是记录下工作中发生的事. 前阵子给一个汽车集团客户做了一个经销商查询系统,其中一个功能是使用地图标注经销商店面地址,并且实现导航功能. 页面演示地址:ht ...

  2. BootStrap Validator 版本差异问题导致的submitHandler失效问题的解决方法

    最近一直在做互金平台,做到后台提交表单的时候出现验证提交数据一直没有提交的问题.于是百度了一下.果然是版本问题造成的.幸好找到了问题所在.我一直仿照的是东钿原微信平台的做法,但是使用byond的后台框 ...

  3. bootstrap弹出模态框会给body加padding的解决方法

    bootstrap弹出模态框会给body加padding,导致页面缩放的解决方法: 在页面或是css文件里加上($paddingSize为less变量,需要改成像素或是其他单位,如12px,1rem) ...

  4. 火狐浏览器如何js关闭窗口的几种解决方法

    今天在项目上有一个页面要求在几秒后自动关闭,想着还比较简单,用window.close()就可以了,但是用IE/谷歌/火狐浏览器试了一下,发现IE可以,谷歌用网上的兼容方法也可以实现,但是火狐这里卡住 ...

  5. 关于Cocos2d-x程序运行时候提示关闭程序的框框的解决方法

    1.这个情况是资源没有被加载的表现 如果AppDelegate.cpp里面没有文件索引的语句 FileUtils::getInstance()->addSearchPath("res& ...

  6. win10x软件字体有阴影很模糊的解决方法(软件分辨率与系统分辨率不一致)

    devC++,百度网盘等软件都有这种情况 拿百度网盘举例:界面比较大,不能缩小,字体有阴影比较模糊 解决方法: 桌面右击百度网盘,选择属性, 点击兼容性,更改高DPI设置,替代高DPI缩放行为前面打上 ...

  7. 关于idea新建子目录时往父目录名字后叠加而不是树形结构的解决方法(转)

    我们在IDEA中创建子目录时,子目录总是在父目录后面叠加而不是树形,如下 我们可以打开项目窗口的右上角的设置标志, 将红圈选项的√先去掉,创建好子目录后再将它选中就可以

  8. c#关闭excel进程失败的解决方法

    解决方法如下: 1.运行命令dcomcnfg -32,打开组件服务 2.找到execl服务,属性中设置交互式用户 2.设置用户权限 3.设置IIS权限

  9. 【转】 VC++ 关闭程序后任务管理器进程中进程仍然存在的解决方法

    转载出处:http://blog.csdn.net/zac_sian/article/details/50809084 可以从以下两个方面进行查找! 1.程序开启了进程,进程中使用了while(1), ...

随机推荐

  1. JS类、对象、方法、prototype、_proto_

    案例代码: function People(name) { //对象属性 this.name = name; //对象方法 this.Introduce = function() { alert(&q ...

  2. Python3.x:将数据下载到xls时候用xml格式保存一份读取内容

    Python3.x:将数据下载到xls时候用xml格式保存一份读取内容 核心代码: import json import xml.dom.minidom from urllib import requ ...

  3. Ant Design 常用命令汇总

    Ant Design React 安装 1. 安装脚手架工具# antd-init 是一个用于演示 antd 如何使用的脚手架工具,真实项目建议使用 dva-cli. $ npm install an ...

  4. WCF基本知识

    1.开通WCF调试服务: 须在服务端的行为中作如下配置:includeExceptionDetailInFaults="true" 代码如下: <behaviors> ...

  5. 20144303 《Java程序设计》第三周学习总结

    20144303 <Java程序设计>第三周学习总结 教材学习内容总结 •对象是存在的具体实体,具有明确的状态和行为,类是具有相同属性和行为的一组对象的集合,用于组合各个对象所共有操作和属 ...

  6. 关于office word 应用程序下载配置

    Retrieving the COM class factory for component with CLSID {000209FF-0000-0000-C000-000000000046} fai ...

  7. Hadoop资源调度器

    hadoop调度器的作用是将系统中空闲的资源按一定策略分配给作业.调度器是一个可插拔的模块,用户可以根据自己的实际应用要求设计调度器.Hadoop中常见的调度器有三种,分别为: 1.基于队列的FIFO ...

  8. 第九篇:Spark SQL 源码分析之 In-Memory Columnar Storage源码分析之 cache table

    /** Spark SQL源码分析系列文章*/ Spark SQL 可以将数据缓存到内存中,我们可以见到的通过调用cache table tableName即可将一张表缓存到内存中,来极大的提高查询效 ...

  9. 关于xftp连接不了Linux,但是却可以用xshell连接Linux

    解决方法:用sftp协议,不要用ftp协议

  10. js创建表格

    js创建一个表格,其中的表头已经有了,要从json中读取的数据一行一行地创建表格 function create_table(data){ tableNode = document.getElemen ...