<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. 案例四:Shell脚本生成随机密码

    生成随机密码(urandom版本) #!/bin/bash #Author:丁丁历险(Jacob) #/dev/urandom文件是Linux内置的随机设备文件 #cat /dev/urandom可以 ...

  2. 【硬件基础知识】指令集框架(ISA:Instruction Set Architecture)

    指令框架(ISA:Instruction Set Architecture) 定义 指令集架构(英语:Instruction Set Architecture,缩写为ISA),又称指令集或指令集体系, ...

  3. 匿名函数 =匿名方法+ lambda 表达式

    匿名函数的定义和用途 匿名函数是一个"内联"语句或表达式,可在需要委托类型的任何地方使用. 可以使用匿名函数来初始化命名委托[无需取名字的委托],或传递命名委托(而不是命名委托类型 ...

  4. 使用Oracle的PROFILE对用户资源限制和密码限制

    转至:https://blog.csdn.net/zhuomingwang/article/details/6444240?utm_medium=distribute.pc_relevant.none ...

  5. Python3中__repr__和__str__区别

    示例: class Test(object): def __init__(self, value='hello, world!'): self.data = value >>> t ...

  6. LeetCode-045-跳跃游戏 II

    跳跃游戏 II 题目描述:给定一个非负整数数组,你最初位于数组的第一个位置. 数组中的每个元素代表你在该位置可以跳跃的最大长度. 你的目标是使用最少的跳跃次数到达数组的最后一个位置. 假设你总是可以到 ...

  7. 学习linux(centos7)记录的笔记

    此随笔用于记录学习<linux鸟哥的私房菜>过程中1.遇到的问题及解决的过程 2.有必要记录的重要内容 3.对应书上操作的记录 开始于2021年6月18号 一个磁盘的分区通过格式化后成为一 ...

  8. C#学习路线和感想

    C#我目前是针对我所需要的部分进行有选择的学习,我看了<C#程序设计经典300例>,发现这个语言还是很有趣的,企业实用性很强,如果以后想做企业这一块可以学学.

  9. 微信小程序 和 laravel8 实现搜索后分页 加载

    Page({ /** * 页面的初始数据 */ data: { activity:{}, page:1, last_page : 0, keyword:'' }, //加载 scroll(e){ le ...

  10. layui 的使用 表单的使用

    <link rel="stylesheet" href="__STATIC__/layui/css/layui.css" media="all& ...