使用bootstrap时下拉菜单失效问题解决

最新推荐文章于 2023-02-23 22:23:32 发布
最新推荐文章于 2023-02-23 22:23:32 发布
阅读量1.2k 收藏 3
点赞数 2
文章标签： bootstrap 下拉菜单失效
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_39773004/article/details/108552654
版权

因为方便，我使用的是 BootCDN 提供的免费 CDN 加速服务

第一次使用，导入顺序错了，下拉菜单功能不显示，修改一下就好
在这里插入图片描述

<!--导入顺序出错
	  导入的.js顺序错误
	  1.导入bootstrap的.css文件
	  2.导入jquery的.js文件
	  3.导入bootstrap的.js文件
	  -->
	<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
	<script src="https://cdn.jsdelivr.net/npm/jquery@1.12.4/dist/jquery.min.js"></script>
	<script src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
呱？！
关注
  • 2
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
bootstrap4.0 下拉菜单无法显示
查无此人的博客
02-28 550
代码菜鸟一枚，正在摸索bootstrap框架，顺便记录一下自己遇到的问题。 使用版本: css： bootstrap4.3.1 js: jquery3.2.1 popper1.15.0 bootstrap4.3.1 使用方式： 从某个CDN网站（https://www.bootcdn.cn/）外部引入。 使用Firefox和Google浏览器通过F12对导入资源自查，发现加载没有问题，但仍然无法显...
解决bootstrap中下拉菜单点击后不关闭的问题
10-18
总之，解决Bootstrap中下拉菜单点击后不关闭的问题，关键在于理解事件传播机制，并通过添加特定的事件监听器和属性来控制下拉菜单的关闭行为。通过这种方式，我们可以确保下拉菜单在需要的时候保持打开状态，提供更...
解决bootstrap dropdown 下拉菜单有时候不能显示的问题
weixin_30454481的博客
07-26 1794
问题描述： dropdown 在index页面能正常下拉，但是在弹出框不能正常下拉。或者在弹出框可以下拉，关闭后，在index页面不能下拉了 解决： 弹出框是在index页面内的。在index页面下载了bootstrap.js后不需要再弹出框再加载一次了，不然就会出现上述描述问题。 将所有弹出框加载的js去掉即可解决 转载于:https://www.cnblogs.com/fancy204...
下拉菜单点击没有反应 bootstrap5
weixin_45928096的博客
02-23 1542
原因： 一般是引入js文件的时候，顺序搞错了或者未引入bootstrap.bundle.js。 解决方法： 使用npm install bootstrap导入bootstrap包
BootStrap中下拉菜单不显示
紫郡的博客
04-29 1829
问题描述 使用BootStrap3.3.7时，按钮下拉菜单点击无反应，但是导航栏的下拉菜单点击正常显示。 解决途径 在使用BootStrap时一定要注意版本问题，需要引入三大文件：css、jquery、js 如果你使用的是BootStrap3.3.7，需要引入： <!-- 新 Bootstrap 核心 CSS 文件 --> <link href="https://cd...
bootstrap 点击下拉框 无反应
StarryaSky的博客
03-19 4864
添加 js 点击事件；以官方文档为例 <div class="dropdown"> <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="tr...
bootstrap 下拉菜单不显示的解决办法
weixin_34194551的博客
11-10 1715
bootstrap 下拉菜单不显示，最后改成如下正常显示： &lt;div class="btn-group open"&gt; &lt;ul class="dropdown-menu"&gt; &lt;li&gt;&lt;a href="#"&gt;Menu1&lt;/a&gt;&lt;/li&gt;
使用contextMenu插件实现Bootstrap table弹出右键菜单
08-31
为了解决这个问题，我们可以借助第三方插件来实现这一功能。这里介绍的是使用`contextMenu`插件来添加Bootstrap Table的右键菜单。`contextMenu`插件是一个强大的jQuery插件，能够方便地为任何元素添加自定义的右键...
bootstrap 导航栏下拉菜单，居右下拉菜单
最新发布
09-05
-- 居右下拉菜单 --> 下拉菜单 动作 另一个动作 <div class="dropdown-divider"></div> 链接 ``` 在这个例子中，`<nav>`标签包裹着整个导航栏，`.navbar-expand-lg`使得导航栏在大屏幕设备上...
JS组件Bootstrap ContextMenu右键菜单使用方法
10-22
主要为大家详细介绍了JS组件Bootstrap ContextMenu右键菜单使用方法，感兴趣的小伙伴们可以参考一下
解决ant-design-vue中menu菜单无法默认展开的问题
01-18
在ant-design-vue的文档中， menu有两个可以传的参数，分别为defaultOpenKeys和openKeys，但在接手做一个项目时，openKeys这个参数前人已经写了，可能是从文档中直接复制demo没有删除掉，我也没去管。 等到需要用到这个defaultOpenKeys的时候，想做每次刷新还会再次打开上次打开的菜单的效果，但一直无效，网上也没有查到有类似的情况，后面只能自己去看源码，查了一下，发现这个代码片段 这段代码不就说明了有openKeys就不会有defaultOpenKeys吗？ 终于解开疑惑，可以继续愉快的敲代码了。 补充知识：ant design中table表
快速解决bootstrap下拉菜单无法隐藏的问题
12-29
想必大家都知道，bootstrap为我们提供了一个下拉菜单的组件，官方也为我们提供两种使用方法 1.标签指定data-toggle <button type=button class=btn dropdown-toggle id=dropdownMenu1 data-toggle=dropdown&gt...
Bootstrap多级菜单的实现代码
08-30
因此，本文将介绍 Bootstrap 多级菜单的实现代码，通过使用 bootstrap-submenu 插件，帮助开发者快速实现三级及以上的菜单。 一、bootstrap-submenu 插件简介 bootstrap-submenu 是一个第三方插件，旨在帮助开发者...
Bootstrap CSS组件之下拉菜单(dropdown)
08-31
Bootstrap CSS组件之下的下拉菜单（Dropdown）是前端开发中常用的一个交互元素，它提供了一种简洁的方法来创建可点击的下拉列表。这个组件基于Twitter Bootstrap框架，它是一个流行的前端开发工具包，用于快速构建...
Bootstrap树形菜单插件TreeView.js使用方法详解
10-21
Bootstrap TreeView.js是一款基于Bootstrap和jQuery的树形菜单插件，它允许你以美观和直观的方式展示层次结构的数据...如果你正在寻找一个强大且易于集成的树形菜单解决方案，那么Bootstrap TreeView.js绝对值得一试。
bootstrap下拉菜单无效的解决方法之一
热门推荐
保持每天都进步
03-01 1万+
问题背景：lz在使用bootstrap遇到下拉列表无效问题，lz引用的jQuery文件为jquery-1.8.2.min.js，bootstarp文件为bootstrap.min.css、bootstrap.min.js。 解决过程：在浏览器打开页面，F12 Network检查js、css资源文件是否正确引用,发现没问题，然后Console发现bootstrap.js报错 Uncaught E
boostrap下拉列表点击不显示，没反应
fenger_c的博客
03-13 624
https://blog.csdn.net/qq_39162733/article/details/78063701?depth_1-utm_source=distribute.pc_relevant.none-task&utm_source=distribute.pc_relevant.none-task。 以上这篇文章解决了我的问题，这种情况已经不是第一次发生了，但是每次解决过段...
Bootstrap下拉菜单失效的解决方法+使用Bootstrap制作响应式网页
qq_53679247的博客
10-21 4212
我们不能同时引入这两个js只能引入其一，同时引入会使得部分功能失效。两个js文件冲突/没有引入指定的js文件。注意我们使用下拉菜单时使用的js是这个。文件名 index.html。文件名index.css。
普通页面引入公共页面之后bootstrap中下拉菜单js效果失效无反应的问题
ZZZMY8的博客
08-27 2945
说下最近写页面遇到的一个坑，公共页面里用bootstrap框架搭了一个导航条，带有下拉菜单的导航条，bootstrap的css样式 和js代码，在公共页面里已经引过了。 普通页面只需要引入下公共页面，就可以共享导航条。在页面中再一次引入了bootstrap的 css 样式 和 js代码 。 问题就是 在普通页面去点击下拉菜单没反应，根本展不开。 原因貌似就是js重复引入的问题， 解决办法就...
Bootstrap Metronic响应式菜单栏实战教程
本篇笔记详细介绍了如何在Bootstrap Metronic完全响应式管理模板中构建和配置菜单栏，适合对前端开发特别是使用Bootstrap框架进行管理界面设计的开发者参考。以下是主要内容概要： 1. **环境配置**： - 项目背景...
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值