bootstrap导航栏下拉框无法下拉问题

最新推荐文章于 2024-03-01 14:27:40 发布

Eaman_Yu

最新推荐文章于 2024-03-01 14:27:40 发布

阅读量4.4k

点赞数 4

CC 4.0 BY-SA版权

分类专栏：前端文章标签： bootstrap jsp

本文链接：https://blog.youkuaiyun.com/Eaman_Yu/article/details/79402384

前端专栏收录该内容

2 篇文章

订阅专栏

本文介绍了一个关于JSP页面中引入Bootstrap JS文件导致的下拉框无法正常显示的问题，并给出了具体的解决方案。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在使用JSP时，在index.jsp引用了bootstrap两个JS文件

<script src="http://cdn.static.runoob.com/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/js/bootstrap.min.js"></script>

并且使用jsp:include标签

<jsp:include flush="true" page="/webpage/inc/incTop.jsp"></jsp:include>

而incTop.jsp也引用了bootstrap的两个JS文件，导航栏写在了incTop.jsp中，最后JS文件冲突导致了下拉框无法下拉问题

将index.jsp中的两个JS文件引用去掉后解决问题

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

Eaman_Yu

关注关注

4
点赞
踩
4

收藏

觉得还不错? 一键收藏
2
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

专栏目录

bootstrap路径导航、下拉菜单

sundanping_123的博客

09-04

816

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0,...

bootstrap 1-导航条和下拉菜单

sanluo11的博客

01-25

7614

1、导航条的制作基于bootstrap的官网,下载bootstrap的环境，就不多说了。导航条依赖JavaScript,响应式导航条依赖折叠（collapse）插件加入以下三个环境的路径导航条的代码如下 //navbar这是一个导航条，navbar-default是默认样式，navigation

2 条评论您还未登录，请先登录后发表或查看评论

bootstrap下拉列表不起作用

风也温柔☆的博客

05-07

1794

由于bootstrap.js是依赖于jquery.js文件，所以文件的顺序应该如下表示。这说明我们导入了bootstrap.css，但是没有导入bootstrap.js文件。我们在使用bootstrap框架的时候，使用下拉列表，只有样式，却点击没反应。

JSP页面下拉框不起作用

luoyonghui55的专栏

12-05

1809

情况如下：首页GIS地图上有一个下拉框不起作用（WIN7 64位IE8）并且在IE下的状态栏还会报一个JS脚本错误，但是用另一台笔记本电脑（XP IE8）访问该地址完全OK，这就说明不起作用很可能就是IE设置（比如：安全级别降到最低；兼容性视图）或者电脑设置问题，在IE各种设置都试了之后依然不起作用。最后把电脑屏幕的分辨率适当的调高之后就完全正常了。

我耀学IT—day05-Bootstrap下拉菜单与导航

2301_78414876的博客

03-01

1449

如果你要设置选项卡是动态可切换的，可以在每个链接上添加 data-bs-toggle="tab" 属性。然后在每个选项对应的内容的上添加 .tab-pane 类，对应选项卡的内容的 <div> 标签使用 .tab-content 类。div 元素上添加 .dropdown-menu 类来设置实际下拉菜单，然后在下拉菜单的选项中添加 .dropdown-item 类。如果我们想让下拉菜单右对齐，可以在元素上的 .dropdown 类后添加 .dropend 或 .dropstart 类。

bootstrap树形下拉框 下拉框树形菜单

11-15

Bootstrap Tree形下拉框是一种将传统的下拉菜单与树形结构结合的UI组件，它使得在有限的空间内展示层级关系的数据变得更加便捷。这种组件通常用于需要用户从一个多级分类中选择一个选项的情况，例如在组织架构、地区...

bootstrap树形下拉框 下拉框树形菜单（修改版）

06-06

在Bootstrap中，下拉框（Dropdown）是一种常见的交互元素，而"bootstrap树形下拉框 下拉框树形菜单（修改版）"则是将传统的下拉菜单与树形结构相结合，以提供更复杂的选项选择体验。在Web开发中，有时我们需要在一...

Bootstrap实现下拉菜单多级联动

08-28

Bootstrap 实现下拉菜单多级联动 Bootstrap 是一个非常流行的前端框架，它提供了许多实用的组件和工具，使得开发者可以快速构建漂亮的网页。今天，我们将讨论如何使用 Bootstrap 实现下拉菜单多级联动。在 ...

HTML5 Bootstrap响应式手机导航下拉菜单代码

06-05

在压缩包中，`index.html`文件包含了整个页面的HTML结构，其中包括了Bootstrap导航栏的HTML代码。这个文件将定义导航菜单的各个部分，如品牌标识、按钮、下拉菜单项等。同时，它可能会利用HTML5的新特性来优化移动...

bootstrap2.0导航栏下拉框

最新发布

10-31

Bootstrap 2.0版本中的导航栏（Navbar）支持下拉菜单（Dropdown）功能，这是一个常见的导航组件，用于创建响应式的、可以折叠的导航结构。要在导航栏上添加下拉框，你需要按照以下步骤操作： 1. **HTML结构**: ...

Bootstrap导航栏下拉菜单不生效的问题

hwxjava的博客

04-29

2935

这里本人使用的是bootstrap3.0版本的。如图按照官方文档导入其中两个即可，css与script即可。但是导入之后还是失效。后面才知道还需要导入 jquery <script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script> 以下是本人亲测ok的 <!DOCTYPE html> <html lang="en"> <head> <me

解决Bootstrap导航条不能下拉

GEEK-BANANA

10-21

2616

前言制作网页的时候发现使用Bootstrap制作的导航条，在页面缩小到一定程度时候变成下拉状态，此时，点击下拉没有用，检查代码没有问题，最后发现的问题是文件引用出现了问题。更改文件的引用顺序不能有误，Bootstrap 的所有 JavaScript 插件都依赖 jQuery，因此 jQuery 必须在 Bootstrap 之前引入， css引用要在js之前。 <head&...

解决 bootstrap 导航栏下拉不能自动回收问题

qq_42004879的博客

10-06

1750

晚间接到朋友的需求. 用bootstrap写的面包屑导航栏，发现导航条下拉时跳转页面下拉的导航条是不会自动回收的，需要自己手动添加onclick事件回收。观察源代码发现规律如下.对应removeaddattr编辑属性到达自动收缩的效果. ...

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

Bootstrap导航条鼠标悬停下拉菜单