bootstrap两层模态框无法滚动问题

在使用Bootstrap模态框时,遇到两层模态框导致的滚动问题。当第二层模态框关闭,第一层因数据过多需滚动,但实际滚动的是父页面。解决方法是在第二层模态框关闭时,通过JS禁掉父页面的滚动条,例如移除body的'modal-open'类,避免多次弹出导致modal-open类积累失效。
部署运行你感兴趣的模型镜像

在项目中使用bootstrap的模态框modal的时候碰到的这个问题。


因为业务需要,在第一层模态框中展示的列表信息,点击查看之后弹出详细信息或新增,这时候需要弹出第二层模态框。


问题就来了,当第二层模态框关闭之后(就是上面那层),下面的第一层模态框因为数据项太多,需要滚动下拉,

但是实际情况是,如果不做处理的话,这时候滚动下拉的就是父页面了。


在网上搜索之后,说是可以在关闭第二层模态框的时候禁掉父页面的下拉条,找到的解决方法如下:

在第二层模态框上加上类似如下js代码:

$('#newChickItem').on('hidden.bs.modal', function () {
      document.getElementsByTagName('body')[0].className = 'modal-open';
});

大概就是在第二层模态框的时候禁掉父页面的下拉条,newChickItem就是第二层模态框的id了。

注意其中用=号就是把父页面的body的class替换掉了,因为用+=追加的话如果不刷新整体页面就会导致body的class中有很多modal-open,从而导致没有效果。







您可能感兴趣的与本文相关的镜像

Wan2.2-T2V-A5B

Wan2.2-T2V-A5B

文生视频
Wan2.2

Wan2.2是由通义万相开源高效文本到视频生成模型,是有​50亿参数的轻量级视频生成模型,专为快速内容创作优化。支持480P视频生成,具备优秀的时序连贯性和运动推理能力

声明:该设计资料来源于网友eeworld-lb8820265的开源分享,仅供学习参考,不可用途商业用途。 你是否也和我一样有这样的疑惑:论文中那么多四旋翼控制算法和姿态解算算法,为何在开源四旋翼平台中见不到?控制算法都是PID,姿态解算都是mahony和EKF。 但现在四旋翼控制还存在很多问题,例如:抗干扰能力和鲁棒性有待继续提高,变重心变质量情况下的控制效果不佳,起飞不稳定,室内自主悬停控制不够理想,惯性导航和室内导航精度低等。可研究的内容还很多,任重而道远。会发现当仿真通过后,却找不到一个趁手的四旋翼平台进行验证。 目前适合研究的四旋翼平台: Pixhawk功能强大,可扩展性好。但是也存在着如下的问题: 1. 编译复杂,开发环境不是IDE,无法在线debug 2. Nuttx操作系统复杂,而且实时性有待提高,传感器数据读取到最后控制输出的时间过长 3. 很多代码用matlab生成,不利于阅读,没有利用F4的Dsp核,效率低下,且代码结构复 杂,不利于二次开发 4. 数传速度低,只有1Hz,不能实时分析 5. IMU没有减震,需要整个飞控加减震 6. 修改程序到成功烧录过程繁琐,且不支持无线更新 大疆的M100和guidance是不错的开发平台,但是却主要用来开发视觉算法。控制算法和姿态解算给封装了。 其他:某宝上面的各种飞控,元器件性能低下,无操作系统,控制算法和姿态解算算法性能低,接口少,作为玩具还可以,作为科研那就呵呵了。Ascending Technologies公司的四旋翼开发平台倒是经常被各个科研院校和比赛使用,但是价格摆在那里。 因此越来越感受到拥有一个适合研究的四旋翼平台的重要性,无奈我个人的精力和能力有限,因此开贴聚拢志同道合的朋友共同学习,只有开源才能促进技术的进步。 初步设想的四旋翼具有如下的特点: 1. 具有先进的控制和姿态解算算法 2. 程序模块化设计,方便各种算法的实现 3. 提供Matlab仿真和理论支持 4. 高速数传,数据波形实时查看和分析 5. 高性能MCU和IMU 6. 优化代码,充分利用DSP核 7. 支持无线更新 8. 使用IDE编写、编译、调试和烧录 9. 采用简单高效的操作系统,充分减少控制延时 10. IMU放到有减震海绵的铝盒子里,接口形式可更换不同方案 11. 提供多种常见接口,也提供以太网接口,方便连接机载电脑 根据我个人的优势和技术的特点,初步确定四旋翼软硬件如下: MCU+GPS+IMU盒子方案一: 元器件 型号 MCUSTM32F746ZGT6 GPS+Mag3DR GPS Acc+MagLSM303AGR GroL3GD20H Acc+GroLSM6DSM 气压计LPS22HB IMU盒子方案一全部采用ST最新的高性能元器件,有现成的驱动,和Pixhawk一样采用双陀螺仪加速度计冗余设计。MCU 采用高性能F746,可以运行复杂算法。 IMU盒子方案二:元器件型号 AccADXL354 GroADXRS642 ×3 气压计MS5803 IMU盒子方案二采用ADI高性能惯性传感器和高性能气压计,满足更高性能需求。飞控软件相关: 部分 具体 操作系统FreeRTOS 文件系统FatFs 通信协议Mavlink 开发环境Keil+QT 协同工作Github 开源协议BSD3-clause 四旋翼飞控的主板,IMU,元器件和主控板第一代实物截图: 过一番探讨,决定第一版硬件采用三部分组成,核心版采用Nucleo F767,主板固定在机架上,IMU做成减震盒子。 主板上接口与硬件:PWM遥控接口,PPM遥控接口,8个电机控制接口,1个PWM用户接口, 3DR GPS的接口,SD卡接口,电源管理,Flash,三色LED灯,F450机架接口。 IMU上硬件与接口:LSM6DSM,LPS22HB,LSM303AGR,ICM20608,2W加热电阻,3.3V电源,14pin的排线接口。 IMU上采用了很多冗余器件,例如LSM6DSM与ICM20608功能重合,主要是为了测试性能。 说明: EEDrone开源四旋翼从零开始详细的制作步骤,详见“相关文件”超链。
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值