<script type="text/javascript">
top.global={zIndex:null};
$("body>div[data-manage]").on('show.bs.modal',function(e){
let relatedTarget=$(e.relatedTarget);
if(relatedTarget.attr("data-toggle")=="modal"){
let targetName=relatedTarget.attr("data-target");
if(targetName!=null){
//设置z-index值
if(top.global.zIndex==null){
top.global.zIndex = parseInt($(targetName).css("z-index"));
}
$(targetName).css("z-index",top.global.zIndex++);
console.log("count:"+$("div.modal-backdrop").length);
};
}; }); $("body>div[data-manage]").on('shown.bs.modal',function(e) {
let modal_backdrop_first=$("div.modal-backdrop:first");
modal_backdrop_first.css("display","block");
$("div.modal-backdrop").not(modal_backdrop_first).css("display","none");
}); </script>

只需要更改Jquery的selector选择器就可以使用了

Bootstrap Javascript组件,模态框级联open解决方案的更多相关文章

  1. JavaScript插件——模态框

    Bootstrap3.0学习第十七轮(JavaScript插件——模态框)   前言 阅读之前您也可以到Bootstrap3.0入门学习系列导航中进行查看http://www.cnblogs.com/ ...

  2. Bootstrap Modals(模态框)

    http://www.runoob.com/bootstrap/bootstrap-v2-modal-plugin.html 描述 Bootstrap Modals(模态框)是使用定制的 Jquery ...

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

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

  4. bootstrap课程11 模态框如何使用

    bootstrap课程11 模态框如何使用 一.总结 一句话总结:多看手册咯. 1.模态框对应的英文单词是什么? modal,而不是madel 2.bootstrap中如何关闭某个效果? 比如要关掉m ...

  5. Bootstrap3.0学习教程十七:JavaScript插件模态框

    这篇文章中我们主要来学习一下JavaScipt插件模态框.在学习模态框之前,我们先来了解一下JavaScript插件吧. JavaScript插件概览 插件可以单个引入(使用Bootstrap提供的单 ...

  6. 拥Bootstrap入怀——模态框(modal)篇

    置顶文章:<纯CSS打造银色MacBook Air(完整版)> 上一篇:<CSS绘制Android Robot> 作者主页:myvin 博主QQ:851399101(点击QQ和 ...

  7. 整理:手机端弹出提示框,使用的bootstrap中的模态框(modal,弹出层),比kendo弹出效果好

    效果图: 我的代码示例: <!--提示模态框--> <div class="modal fade" id="myModal" tabindex ...

  8. bootstrap 点击模态框上的提交按钮后,模态框不能关闭的解决办法

    项目问题如下图, 点击确定后,模态框没反应,按理,点击删除按钮时,弹出确认删除的模态框,点击确定后,使用ajax请求服务器,把数据库中对应的数据进行删除,根据服务器 servlet返回的状态值(del ...

  9. Bootstrap——可拖动模态框(Model)

    还是上一个小项目,o(╥﹏╥)o,要实现点击一个div或者button或者一个东西然后可以弹出一个浮在最上面的弹框.网上找了找,发现Bootstrap的Model弹出框可以实现该功能,因此学习了一下, ...

随机推荐

  1. 使用while循环和for循环输出2~100之间的素数(只能被1和自己整除的自然数)

    不管是while循环还是for循环,原理都是取根号,循环到取根号后的数,至于为什么需要循环到开根后的数,我想主要是因为一个数的分解因子在开根号后的数向上取整以下吧. 话不多说,上代码: while循环 ...

  2. c# 编程学习(三)

    方法是具名的语句序列 returnType methodName ( parameterList ) {  // 这里添加方法主体语句 } returnType(返回类型)是类型名称,指定方法返回的数 ...

  3. 在Mac上安装mysql并配置环境(详细篇)

    在Mac上安装mysql并配置环境(详细篇) 1.下载mysql mysql官网 这一步根据自己电脑架构选择,分为arm和x86 下载完成之后打开就可以 接下来运行安装就可以,一直下一步,设置完密码就 ...

  4. WPF中TreeView控件数据绑定和后台动态添加数据(一)

    数据绑定: 更新内容:补充在MVVM模式上的TreeView控件数据绑定的代码. xaml代码: <TreeView Name="syntaxTree" ItemsSourc ...

  5. Windows Server 2012 R2通过命令行重置网络环境

    转至:https://jingyan.baidu.com/article/48b37f8d5d89385a646488b5.html 我们使用Windows Server 2012 R2时会遇到通过命 ...

  6. Java课程设计---索引

    一.基础配置 ============================================================== 1.Java课程设计---Eclipse基本环境配置 2.J ...

  7. 5.注入内部Bean

    我们将定义在 <bean> 元素的 <property> 或 <constructor-arg> 元素内部的 Bean,称为"内部 Bean". ...

  8. Qt:Shadow Build

    每个编辑器有Build和Run两个设置界面. 在Build界面上,有一个"Shadow build"复选框.如果勾选此项,编译后将在项目的同级目录下建立一个编译后的文件目录,目录名 ...

  9. Qt:QDir

    0.说明 QDir提供了访问目录及目录下内容的类. QDir既可以用于访问文件系统,也可以用于访问Qt 资源系统(Qt's resource system.). Qt用 "/" 作 ...

  10. 非常详细的python和pycharm下载安装教程

    目录 引言 为什么要学python 下载网址 python下载及安装 pycharm下载及安装 你人生中的第一句python 引言   Python诞生于1989年的一个圣诞节,其创作者Guido v ...