在网上找手动关闭BootStrap模态框的解决方法,说是(需要引用bootstrap.js等):

$("#myModal").modal('hide');

但是我发现我的只能关闭

不能关闭下面那半透明层。找了下发现是出现这两行代码的缘故。

<div class="modal-backdrop fade in"></div>
<div class="modal-backdrop fade in"></div>

所以,我就用了笨办法,在css中加了个类

.yincang{display:none;}

然后在js中,又加了行代码:

$(".modal-backdrop").addClass("yincang");

所以对于手动关闭BootStrap模态框,我目前的解决办法是

<style>
.yincang{display:none;}
</style>
<script>
$("#myModal").modal('hide');
$(".modal-backdrop").addClass("yincang");
</script>

但是还是有点点问题。点击“close”时,那两个<div>是消失的,但是现在我改后,当点击“Call to action”后,仍然存在一个<div>,是这样子的:

<div class="modal-backdrop fade in yincang"></div>

以后再改进吧。

关于手动关闭BootStrap模态框的更多相关文章

  1. bootstrap模态框手动关闭遮盖层不消失

    模态框中 加载了一个子页面 子页面中调教表单之后想根据执行结果手动关闭模态框,最初尝试了以下几种方案: 1.$("#myModal").modal('hide');//模态框关闭 ...

  2. bootstrap模态框手动开启关闭与设置点击外部不关闭

    http://www.cnblogs.com/qlqwjy/p/7491054.html 完整的参考菜鸟教程:http://www.runoob.com/bootstrap/bootstrap-mod ...

  3. Bootstrap 模态框 + iframe > 打开子页面 > 数据传输/关闭模态框

    父页面bootstrap模态框: <div class="modal fade" id="myModal" tabindex="-1" ...

  4. bootstrap模态框关闭后清除模态框的数据

    https://segmentfault.com/q/1010000008789123 bootstrap模态框第二次打开时如何清除之前的数据? 我用了bootstrap模态框的remote功能,在弹 ...

  5. Bootstrap 模态框(Modal)插件

    原文链接:http://www.runoob.com/bootstrap/bootstrap-modal-plugin.html Bootstrap 模态框(Modal)插件 模态框(Modal)是覆 ...

  6. BootStrap 模态框基本用法

    <!DOCTYPE html> <html> <head> <title>Bootstrap 实例 - 模态框(Modal)插件方法</title ...

  7. Bootstrap模态框按钮

    1.触发模态框弹窗的代码 这里复制了一段Bootstrap模态框的代码 <h2>创建模态框(Modal)</h2> <!-- 按钮触发模态框 --> <but ...

  8. Bootstrap 模态框在用户点击背景空白处时会自动关闭

    问题: Bootstrap 模态框在用户点击背景空白处时,会自动关闭. 解决方法: 在HTML页面中编写模态框时,在div初始化时添加属性 aria-hidden=”true” data-backdr ...

  9. 去除bootstrap模态框半透明阴影

    当使用bootstrap模态框默认自带半透明阴影,如果想要去除阴影,需要怎么做呢? 今天在项目中我遇到了这个问题,想要去除模态框的阴影,试了好久都没解决.后来问同事的时候才知道,当模态框弹出后,会加上 ...

随机推荐

  1. 创建 Mac OS X 10.9 USB 安装盘

    通过 App Store 下载最新的 OS X 10.9 在“应用程序”目录找到下载的 OS X 10.9 安装文件,选中并鼠标右键,菜单中选择“显示包内容” 弹出的 Finder 中进入 Conte ...

  2. ASP.NET4.5Web API及非同步程序开发系列

    ASP.NET4.5Web API及非同步程序开发系列 认识ASP.NET WEB API 他的前身为WCF WEB API用于协助WCF支持RestFul.现在集成进ASP.NET,正式更名为ASP ...

  3. linux访问windows共享文件夹

    如有版权问题,纯属巧合! ======================================================= windows 上开启共享目录 比如共享了X盘的share文件 ...

  4. IOS开发笔记 - 基于SDWebImage的网络图片加载处理

    前言: 在IOS下通过URL读一张网络图片并不像Asp.net那样可以直接把图片路径放到图片路径的位置就ok, 而是需要我们通过一段类似流的方式去加载网络图片,接着才能把图片放入图片路径显示. 这里找 ...

  5. [置顶] MyElipse9.0 M1安装svn(测试100%通过)

    为什么标题要写100%通过呢?原因是以前的方法(直接复制到plugin里(MyEclipse 6.0可以,我试过),link安装)都不好用了,9.0M1不吃这一套,所以告诉大家这么做一定能够装上!! ...

  6. 图的匹配问题与最大流问题(三)——最大流问题Ford-Fulkerson方法Java实现

    上篇文章主要介绍了Ford-Fulkerson方法的理论基础,本篇给出一种Java的实现. 先借助伪代码熟悉下流程 FORD-FULKERSON(G,t,s) 1 for each edge(u,v) ...

  7. 登录验证全局控制的几种方式(session)

    在登陆验证或者其他需要用到session全局变量的时候,归结起来,主要有以下三种较方便的实现方式.(其中个人较喜欢使用第一种实现方法) 一,在一个公共类里创建一个公共方法,然后需要验证的页面都调用这个 ...

  8. mssql分页原理及效率分析

    下面是常用的分页,及其分页效率分析. 1.分页方案一:(利用Not In和SELECT TOP分页) 语句形式: SELECT TOP 10 * FROM TestTable WHERE (ID NO ...

  9. linux下如何使用USB存储设备

    如何在Linux环境中使用USB接口的 存储 设备?这是各大电脑论坛上出现得比较多的一个问题,同此可见这也是摆在许多电脑玩家面前的一道难题. 本文就为您提供一套完美的解决方案,通过下面的方法,您仅可以 ...

  10. javascript代码实现简单的五星评价功能!

    <script type="text/javascript"> //★ var spans=document.getElementsByTagName("sp ...