如何监听Bootstrap下拉菜单中按钮的点击？-Javascript
要监听Bootstrap下拉菜单中按钮的点击，可以使用JavaScript来实现。
首先，我们需要为下拉菜单的按钮添加一个点击事件监听器。可以使用addEventListener方法来实现：
// 获取下拉菜单按钮的元素
var dropdownBtn = document.getElementById("dropdown-btn");
// 添加点击事件监听器
dropdownBtn.addEventListener("click", function(event) {
// 在这里编写处理点击事件的代码
});在事件监听器的回调函数中，可以编写处理点击事件的代码。
此外，为了使下拉菜单在点击按钮时展开或收起，还需要使用Bootstrap提供的相关功能。一种常用的方式是使用Bootstrap的data-toggle属性和data-target属性来指定下拉菜单的目标元素。
下面是一个完整的示例代码：
<!DOCTYPE html>
<html>
<head>
<title>监听Bootstrap下拉菜单中按钮的点击</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/css/bootstrap.min.css">
</head>
<body>
<div class="dropdown">
<button id="dropdown-btn" class="btn btn-primary dropdown-toggle" type="button" data-toggle="dropdown">
下拉菜单按钮
</button>
<div class="dropdown-menu">
<a class="dropdown-item" href="#">菜单项1</a>
<a class="dropdown-item" href="#">菜单项2</a>
<a class="dropdown-item" href="#">菜单项3</a>
</div>
</div>
<script>
// 获取下拉菜单按钮的元素
var dropdownBtn = document.getElementById("dropdown-btn");
// 添加点击事件监听器
dropdownBtn.addEventListener("click", function(event) {
// 在这里编写处理点击事件的代码
console.log("按钮被点击了！");
});
</script>
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/js/bootstrap.min.js"></script>
</body>
</html>这个示例代码中，我们首先引入了Bootstrap的CSS和JavaScript文件。然后，在页面中创建了一个下拉菜单，其中按钮的id为"dropdown-btn"。接着，使用JavaScript获取该按钮的元素，并为其添加了一个点击事件监听器。在监听器的回调函数中，我们简单地打印出了一条信息。最后，引入了Bootstrap所需的jQuery和Popper.js库文件，以及Bootstrap的JavaScript文件。
这样，当下拉菜单的按钮被点击时，就会触发点击事件监听器的回调函数，并执行其中的代码。
希望这个回答对你有所帮助！如果需要了解更多关于云计算、IT互联网领域的知识，请随时提问。
相关·内容
1回答
我有一个包含下拉菜单的导航栏。下拉菜单有Javascript，当点击下拉按钮时，它会改变插入符号的方向。然而，当下拉列表中的任何空间被点击时，下拉列表就会折叠。我在下拉列表中有一个搜索栏，它不能使用。如何将javascript更改为只在单击按钮时折叠和展开。
Javascript
<script>
$(document).ready(function(){
$('.dropdown').click(function(e){
$(this).find('.dropdown-menu').toggleClass('show')
浏览 31提问于2018-08-01得票数 0
回答已采纳
1回答
我得到了bootstrap下拉菜单，但需要一些改变，不知道怎么做，
这是起始位置：
当我点击这个按钮时，我需要这个动作：
所以当我点击按钮列表将向下滑动，这个添加到列表将改变新的列表标题(按钮)
这是我的bootstrap codee for list：
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.boo
浏览 0提问于2016-08-18得票数 0
我使用twitter bootstrap作为我的站点框架。我也在使用jQuery。
在我的主导航栏中，我有一个包含搜索框的bootstrap下拉菜单。搜索框有一个jQuery自动补全功能，可以完美地工作。
然而，我的问题是，当用户点击自动完成列表中的一项时，引导下拉列表关闭，防止用户单击“搜索”按钮，直到他们重新打开下拉列表(搜索查询仍然存在)。
当从自动完成列表中进行选择时，有没有一种简单的方法可以防止下拉菜单关闭？这是由于两个框架之间的冲突吗？
提前谢谢。
戈登
更新：
<script type="text/javascript">
浏览 3提问于2013-01-29得票数 2
0回答
下拉菜单不在选定的下拉按钮上居中
、、、、
我正在制作一个下拉菜单，但我的LinkButton1的下拉菜单在单击时并不与按钮本身对齐(相反，它会下降到第一个按钮的下方)。顺便说一下，我正在使用bootstrap。
以下是我的代码：
<div class="dropdown" >
<ul> <li>
<button class="btn btn-link dropdown-toggle" type="button" data-toggle="dropdown">Women's
浏览 6提问于2016-07-14得票数 0
回答已采纳
我有一个标准的Twitter Bootstrap 3导航栏，上面有一些按钮(根据这里： )。我想要更改折叠行为(当它变成某个屏幕宽度下的下拉菜单时)，以便运行我的自定义Javascript函数，而不是创建下拉菜单。这是因为我对小屏幕的界面进行了比CSS所允许的更大范围的更改(例如，我在DOM中移动UI元素等)。
我应该关闭导航栏的折叠行为吗?如果是这样，该如何关闭？
然后我考虑页面加载和页面大小调整(使用JQuery的resize()事件)我检查新的窗口宽度并触发移动UI (通过我的函数)，如果宽度低于折叠点？
或者有没有更好的方法来做到这一点？
任何想法都很感谢！谢谢
浏览 0提问于2015-09-29得票数 0
我想做一个使用twitter的bootstrap框架的应用程序。我有一个导航栏，它的功能类似于File /Edit/Help/等的File菜单栏。
我喜欢你需要点击使下拉菜单出现的事实，然而，我如何才能使它从文件菜单移动时(在它被点击并下拉之后)它将在编辑菜单下拉。
这方面的一个例子是转到google docs，点击一个菜单，然后移动到另一个菜单项，它将下拉新的悬停菜单
浏览 0提问于2012-05-13得票数 3
回答已采纳
我是Twitter BootStrap的新手，我有以下问题。
我知道BootStrap提供了一个下拉菜单，如下所示：
以这种方式实施：
<div class="dropdown">
<button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true&#
浏览 3提问于2015-09-02得票数 1
回答已采纳
我有bootstrap下拉菜单。为了让它在单击内部下拉菜单时保持显示，我将其设置为JavaScript，如下所示
$('.dropdown-menu').click(function(e)
{
e.stopPropagation();
});
它起作用了。现在我有了
$(document).ready(function()
{
$('body').on("click",'#btn_post',function(e)
{
alert("waw");
}
}
浏览 0提问于2016-03-15得票数 0
2回答
改变Bootstrap菜单的最简单的方法是点击下拉菜单，而不是悬停菜单？
示例url：
这可以通过bootstrap来实现吗，纯粹通过CSS或者一点JavaScript？
浏览 1提问于2013-03-20得票数 2
是否可以在bootstrap中创建带有子菜单的导航栏，但不使用下拉菜单？我的意思是，当点击这个按钮时，子菜单应该出现在主菜单按钮的右侧。
浏览 0提问于2016-03-31得票数 0
4回答
在我的应用程序中，我添加了关闭按钮side bootstrap下拉菜单。单击关闭按钮，我必须关闭该下拉菜单。这可以正常工作，但是当我点击dropdown之外的任何地方时，dropdown并没有关闭，这里是goo.gl/3RAkBw：
有人能告诉我怎样才能结账吗
浏览 2提问于2016-10-04得票数 5
1回答
当使用时，toogle按钮不工作
、、、、
我想建立一个基本的网站。在nav.html文档中，我设计了一个基本的下拉菜单。当我打开带有浏览器的nav.html时，切换按钮正常工作，当我单击它时，下拉菜单会折叠，当我再次单击它时，下拉菜单就会消失。当我在一个nav.html文件中包含home.php时，就会出现这个问题。当我点击切换按钮时，下拉菜单就会崩溃，但是当我再次点击它时，下拉菜单将保持打开状态，不会消失。
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scal
浏览 1提问于2019-10-14得票数 0
回答已采纳
我刚刚用一个onclick事件创建了两个按钮，
您可以查看按钮的演示。
然而，我需要帮助解决两个问题，我不知道如何解决。
第1期
正如您在演示中所看到的，如果您首先单击一个按钮，就会出现一个下拉菜单，但是如果在第一个下拉菜单可见时单击第二个按钮，则第二个下拉菜单与第一个下拉菜单重叠。
当您使用javascript单击页面上的其他位置或另一个按钮时，如何关闭下拉列表？
第2期
我希望按钮看起来像这样，即使你悬停在按钮上
当你点击按钮，当下拉菜单变得可见时，这就是它的样子。它应该保持这样，即使你没有你的鼠标按钮或下拉菜单。
如何使用JavaScript完成这一任务？
提前感谢！
浏览 3提问于2014-03-23得票数 1
1回答
我的代码：
<head>
<!-- All the required scripts and CSS -->
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"><
浏览 3提问于2015-01-13得票数 0
回答已采纳
1回答
我想使用，但是我不能让下拉菜单在我点击按钮时出现。我对web开发非常陌生，所以我想我错过了一个其他人都很明显的步骤，甚至在中都没有提到。
提到，在css/bootstrap文件夹中有一些“相关的css文件”。这是真的吗？它们是什么文件？
到目前为止，我已经完成了以下操作，以便在我的页面上安装此控件。
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="sty
浏览 0提问于2013-12-05得票数 1
1回答
我想要实现背景覆盖，使背景变暗时，引导纳瓦菜单项是在下拉状态。
你可能已经在亚马逊的新主题上看到了这种效果。当用户单击“部门”菜单项并显示下拉菜单项时，背景会变暗。
我确实搜索了网页和堆栈溢出，但没有找到任何解决方案。也许你有个解决办法。
到目前为止，我只有CSS实现-覆盖效果。现在我想将它绑定到下拉状态动作中。
注意:当用户点击屏幕上的其他地方时，下拉菜单就会关闭，覆盖层应该显示:没有。
<style>
#overlay{
position:absolute;
top:0px;
left:0px;
bottom:0px;
right:0px
浏览 0提问于2014-09-23得票数 3
回答已采纳
1回答
我有一个视图，它使用共享的_Layout，其中引用了所有样式表和javascript文件。
我的肚脐上有一个dropdown-menu
<a class="dropdown-toggle" role="button" aria-expanded="false" href="#" data-toggle="dropdown">Navigate<span class="caret"></span></a>
<ul class="dro
浏览 0提问于2016-07-19得票数 0
回答已采纳
我有这个下拉菜单，这是在Bootstrap CSS中编写的，我想做一个JavaScript函数来更改按钮的标题。例如，现在按钮的标题是"Category“，但当单击下拉选择时，我希望它显示该值，如"Acceptance”。我已经看过用jQuery解决这个问题的其他帖子了，但我想知道如何用JavaScript解决这个问题，谢谢。 我试过了 JavaScript document.getElementById("dropDownButton").innerHTMl = "acceptanceRate"; 这不起作用，请给出在JavaScri
浏览 35提问于2021-09-03得票数 0
回答已采纳
我正在使用Bootstrap 4下拉选项。
我想为左上角的下拉菜单添加一个向上箭头。
在Bootstrap 3中，我们在按钮上有一个插入符号标记，所以我们可以将箭头添加到下拉菜单中。
但是在Bootstrap4中，我们没有插入符号标记，使用dropdown-toggle类只添加了插入符号。
如何将箭头添加到此处的下拉菜单？
我添加了Bootstrap 3示例链接：
Bootstrap 4中也需要相同的功能。
浏览 2提问于2018-10-03得票数 4
1回答
我似乎对小视图中的Bootstrap折叠下拉功能有一个奇怪的问题。我在XS和S视图的标题中都有图标，在XS中，点击这些图标将扩展功能，而在S中，这些下拉菜单已经打开，如果我尝试点击与下拉菜单交互的按钮，我会得到一个奇怪的动画。
Iv注意到关闭显示：！重要；在引导css (浏览器调试器)中的导航栏-折叠。似乎可以解决这个问题--然而，无论出于什么原因，这都是一个糟糕的修复方法--我不知道如何在我的自定义样式表中重写它。有没有人遇到过类似的Bootstrap崩溃下拉菜单问题？
我已经创建了一个Bootply文档，图片和字体--可怕的图标不会出现在那里，所以它看起来有点奇怪，忽略红线，因为它是用来测
浏览 1提问于2015-10-16得票数 3
1回答
插入可点击的图像
、、
我想插入一个可点击的图像，也就是说，如果图像的任何部分被单击，它将表现为一个按钮元素，或者更可取的是，运行一个Javascript脚本。
我正在考虑将图像插入到按钮元素中，但据我所知，这不仅仅是将整个图像插入到按钮中，而是将其插入到按钮框中。
我如何制作一个可点击的图像，拉出一个脚本？
浏览 0提问于2011-12-17得票数 3
回答已采纳
首先，我在应用程序中使用Bootstrap和Sammy.js。我在下拉菜单(一个下拉按钮)中配置了一些锚点，让它们分别导航到#/login和#/register。问题是，当我点击Login / Register链接时，下拉菜单不会关闭。
我还附上了在Firefox中运行时拍摄的屏幕截图。
我在这里做错了什么？
谢谢。
浏览 0提问于2013-04-04得票数 2
回答已采纳
如何创建一个简单的onClick() if else语句。当用户点击page按钮时，它会转到android中的上一个页面或活动吗？下面是我的代码，但我知道其中缺少了一些东西。你能帮帮我吗？我正在使用eclipse和phonegap for Android。
以下是我的代码：
<script type="text/javascript" charset="utf-8">
document.addEventListener("backbutton", onBackKeyDown, false);
</script>
<s
浏览 2提问于2012-02-29得票数 0
回答已采纳
我被分配了一个任务，我必须在点击时打开一个bootstrap 4下拉菜单，通过创建一个指令，当点击下拉菜单时，会向无序列表中添加一个show class (不允许bootstrap javascript cdn )
我创建了一个名为'appDropdown‘的指令，它将类'show’绑定到名为'isOpen‘的布尔变量，然后我监听点击，然后切换'isOpen’变量，因此每当我单击类'show‘时，就会在该指令所在的元素处添加或删除该类。
HTML代码
<div class="col-xs-12">
&l
浏览 0提问于2019-10-20得票数 0
2回答
我正在使用Bootstrap，并且我正在尝试创建一个下拉菜单，当我单击其中一个导航按钮时将出现该菜单。
下面是我的脚本的引用方式：
<link href="css/bootstrap.css" rel="stylesheet">
<link href="css/bootstrap-responsive.css" rel="stylesheet">
<link href="css/bootstrap.icon-large.css" rel="stylesheet">
浏览 2提问于2013-09-13得票数 0
1回答
引导下拉不起作用
、、、
我正在通过Meteor add xyz (不是脚本标记)将引导程序加载到我的应用程序中，我的项目主管中的隐藏包文件如下：
meteor-platform
autopublish
insecure
twbs:bootstrap
iron:router
bootstrap
accounts-ui
accounts-password
jquery
所以我确实有引导程序，但是当我点击我的bootstrap下拉菜单，甚至这个第三方的可滚动下拉菜单：
下拉式按钮的边缘突出显示，但没有下降。
这里发生了什么事？我也看到过类似的文章，但它们围绕着人们在标题中加载多个twb编译器。我的两个引导包是否有可能造成
浏览 3提问于2015-04-07得票数 2
回答已采纳
我在引导4中创建了一个下拉菜单。我将下拉按钮和下拉菜单放在一个带有class=“容器”的div元素中，我希望下拉切换和下拉菜单能够获得其父元素的全部宽度。我写了这段代码
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css">
<body>
<div class="container">
<button class="dropdown-t
浏览 0提问于2018-09-09得票数 5
回答已采纳
1回答
我正在使用css下拉菜单：
我正在做一个带有ajax调用的jquery (“.on”)事件。在ajax调用之后(如果成功)，我使用下面的jquery代码来关闭下拉菜单：
success: function(data){
$(".dropdown-content").css("display", "none");
...
它可以工作，点击后下拉菜单消失，但其他下拉菜单松开悬停弹出功能，不再显示。我如何编辑代码，以便它只隐藏打开的下拉列表，而不是在隐藏效果后停用悬停弹出窗口？
浏览 0提问于2018-12-08得票数 1
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstra
浏览 0提问于2019-01-24得票数 1
我使用的是Twitter bootstrap的“拆分按钮”下拉菜单，并包含了明显需要的名为bootstrap-button.js的bootstrap javascript，尽管我尝试了很多，但我还是无法让这个该死的东西下拉。然后，我开始删除可能会干扰的JS文件，猜猜会发生什么？bootstrap-button.js文件才是罪魁祸首！这怎么说得通呢？让框下拉的唯一方法是不包括下拉JS文件？
还有没有人见过这个问题？对于如何解决这个问题，有什么建议吗？
浏览 3提问于2012-09-03得票数 1
回答已采纳
6回答
我想做一个下拉菜单，就像delicious在这个页面上做的那样。在此页面中，单击带有“搜索”按钮的箭头。在点击它显示一个下拉菜单，我想要相同的菜单样式，但在我的页面上我有一个链接，我想与该链接，一个简单的小图标将显示，点击该链接或该菜单图像，下拉菜单将打开。
谷歌也做了同样的事情，点击显示在顶部菜单中的“更多”链接。
我想使用最小的javascript，我更喜欢JQUERY。
浏览 4提问于2009-01-27得票数 5
回答已采纳
1回答
我已经意识到在Bootstrap中的标准下拉菜单不能在BlackBerry设备上工作(OS 10)。即使是在旧版的BlackBerry游戏上也没有。我可以点击按钮，它显示它是按下，但下拉菜单不出现。
奇怪的是，当我用BB Q10打开引导引导主站点getbootstrap.com时，下拉菜单正常工作，但当我打开示例页面时，它们就不工作了。因此，显然有一个解决办法。
你知道怎么解决这个问题吗？
非常感谢!
浏览 1提问于2014-02-11得票数 0
回答已采纳
我正在制作的Django网站上使用Twitter bootstrap。我有一个页面，在那里用户可以输入他们的所有技术技能在一个文本输入配备了一个bootstrap typeahead。我正在尝试访问下拉菜单中当前选定的文本，这样，当按ENTER时，下拉菜单中突出显示了一个元素，它将获取该值并将其显示在输入文本字段的下方。然后清除输入文本字段，用户可以搜索其他技能。
$(document).keyup(function(event) {
if (event.keyCode == 13) {
if ($('.dropdown-menu').css(
浏览 0提问于2013-09-10得票数 11
回答已采纳
1回答
为什么我按钮上的下拉菜单不工作？
、、、、
我试图在我的角度应用程序中设置一个基本按钮，当我点击它时，它会显示一个带有不同选项的下拉菜单。
我复制粘贴了一些引导模板代码，并更改了一些类以匹配我的应用程序的外观，但是，当我单击该按钮时，它不会显示下拉菜单。
这是这个按钮的代码
<div class="list-group list-group-flush ">
<div class="Dropdown">
<a routerLink="/homepage/facture" role="button"
浏览 3提问于2022-04-06得票数 0
2回答
下拉自举菜单
、、
我认为代码不应该出现任何错误，因为我已经将它与视频教程进行了几次比较。但是，下拉菜单仍然不能使用。它必须是文件目录或路径的错误。请帮帮我。
<!DOCTYPE html>
<html>
<head>
<title>Dropdowns</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
浏览 0提问于2014-07-29得票数 1
回答已采纳
好吧，我正在学习一些基本的网络编程，当我点击它时，我的下拉菜单总是变成蓝色。我正在谷歌检查器中寻找，我看不到这是在哪里设置的。有人能给我看看吗？
!DOCTYPE html>
<html dir="ltr" lang="en" prefix="content: http://purl.org/rss/1.0/modules/content/ dc: http://purl.org/dc/terms/ foaf: http://xmlns.com/foaf/0.1/ og: http://ogp.me/ns# rdfs: http://ww
浏览 0提问于2020-11-17得票数 0
1回答
我想添加一个输入图像按钮到我的html，当点击时，将给出一个下拉菜单与三个输入范围栏(输入类型=“范围”)。我如何使用html，css，javascript来做这件事？
浏览 2提问于2015-03-18得票数 0
我目前正在使用Twitter bootstrap for Yii ()
当点击一个按钮时，他们网站上显示的模式窗口就会打开。谁有任何关于如何在页面加载时打开模式窗口的线索？
我尝试在javascript中模拟按钮点击加载，但这并不是真正正确的方法
浏览 0提问于2013-08-11得票数 2
我是新手在Bootstrap，我想知道如何添加下拉菜单上的关闭按钮。
不是默认的Bootstrap响应，当我们在菜单外部单击时，或者当我们单击“没有子菜单项”时，我想添加一个关闭按钮，并使它负责切换它。关闭按钮必须同时出现在菜单及其子菜单“查看图片和关闭图标的位置”中。
我工作的代码是“下拉菜单项是‘杂志’，‘旅行单人’是子菜单项"：
如有任何建议，我们将不胜感激！
浏览 4提问于2016-07-13得票数 2
当我点击重置按钮时，我得到了一个jQuery.selectmenu的问题，我希望它像所有其他字段一样被重置。任何输入都会立即刷新，但使用此插件不会刷新。该怎么办呢？
更多细节：
<form action="#" name="editform">
<fieldset>
<select name="speed" id="speed">
<option value="Slower">Slower</option>
浏览 6提问于2011-06-10得票数 3
对于Wordpress页面，我使用过滤器按钮来过滤文章的显示，这取决于它们各自的类别。过滤器按钮通过一个小的javascript工作，它根据按钮链接到的帖子类别打开和关闭帖子的显示。
现在，我想通过一个下拉菜单来访问这些按钮，它总是显示哪个过滤器按钮是活动的。将它们放入下拉菜单中没有问题。然而，对于下一步，我需要一些帮助:我希望下拉菜单总是显示用户点击的活动过滤器按钮，在菜单本身的顶部(即，而不是菜单的原始标题，当页面加载时，在菜单内的任何按钮被点击之前显示)。这怎么可能呢？
下面是下拉菜单中过滤器按钮的html，以及使过滤器按钮能够过滤帖子类别的javascript：
<div cla
浏览 0提问于2017-08-16得票数 0
1回答
如何在多选下拉菜单中应用复选框
、、、、
我需要在多选下拉菜单中应用复选框，但不是成功。我正在使用发送表单创建多选下拉菜单。但不应用此多选下拉菜单中的复选框。所以请帮帮忙
<?php
echo $this->formSelect(
'ctr_partnerId',
$expPartId,
array(
'class' => 'select_input',
'multiple' => true,
'size'
浏览 4提问于2017-04-05得票数 0
1回答
刚刚开始使用Bootstrap，并希望导航栏下拉菜单有一个很好的滑动过渡，但不确定这是否可能在默认的bootstrap选项中。
我的简化html是：
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right">
<li class="dropdown">
<a data-close-others="true" data-
浏览 0提问于2014-01-07得票数 0
2回答
在我的angular 6项目中，我有一个bootstrap模式，我想在关闭时将一个对象传递给模式容器组件！我如何在点击按钮时做到这一点？
<button (click)="activeModal.close()">Ok</button>
浏览 0提问于2019-03-02得票数 0
我的导航栏中有一个下拉菜单，单击时通过向其添加一个show类来打开和关闭它。
这是可行的，但需要用户再次单击该按钮以关闭菜单。作为一种半解决方案，我现在监听路由器更改，并在路由更改时关闭菜单。
但是，如果单击了菜单按钮以外的任何内容，我希望菜单关闭。这样用户就可以点击背景来摆脱菜单了。我该如何实现这一点？
<button class="btn btn-link nav-link dropdown-toggle" (click)="showDropdown=!showDropdown" id="navbarDropdown" role=
浏览 5提问于2018-02-05得票数 0
回答已采纳
2回答
继之后，我仍然在为Twitter Bootstrap而苦苦挣扎。我已经设法让我的导航栏出现了，我正试图给它添加一个下拉菜单。无论我怎么尝试，我都不能让菜单的下拉部分工作！这是我菜单的截图。
正如你所看到的，我有“帐户设置”，这应该是一个下拉菜单，但当我点击它时，没有下拉选项出现。下面是我的代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>@ViewBag.Title</title>
<
浏览 1提问于2012-02-18得票数 7
回答已采纳
1回答
我正在动态创建一个bootstrap下拉菜单。最初，它看起来像下拉菜单，但在第一次点击后，它明显地变成了按钮，而它的工作方式类似于下拉菜单，即单击按钮时我可以看到下拉选项。这是我的HTML。
<div class="dropdown" id="ApplicationNames" style="visibility: hidden">
<button class="btn btn-primary dropdown-toggle" type="button" data-toggle="
浏览 3提问于2016-11-18得票数 0
我使用的是bootstrap3.0，它的下拉菜单很棒。
如果我点击下拉菜单的外部，菜单将会消失，这是非常正确的。
但当我点击下拉菜单的项目时，它也会消失。我认为这并不正确，而且没有任何选项可以控制它的切换行为。(我需要菜单在我单击项目时保持打开，如facebook通知菜单)
所以我想我必须修改bootstrap的源代码，我并不真的想这样做。所以在我接触源代码之前，我想知道有什么好的变通办法吗？如果不是，如何更改源代码以将引导的影响降至最低？
谢谢你的任何想法。
浏览 74提问于2014-02-24得票数 25
回答已采纳
使用bootstrap，我试图在对齐按钮组中的一个按钮中创建一个下拉菜单。更具体地说，我希望下拉菜单列表元素具有与下拉切换按钮相同的宽度。下面的代码做了所有的事情，除了dropdown元素的宽度与切换按钮不同。
<!DOCTYPE html>
<html lang="en">
<head>
<title>Bootstrap Example</title>
<meta charset="utf-8">
<meta name="viewport" content
浏览 9提问于2016-07-08得票数 1
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
云直播活动推荐
腾讯云开发者
