dropdown 相关问题

Vuejs 2 多级下拉菜单

我正在尝试创建一个多级下拉菜单，但它对我不起作用，不知道为什么。我的控制台上没有错误。我正在使用 Vuejs 2.version。 这是我的下拉菜单； 我正在尝试创建一个多级下拉菜单，但它对我不起作用，不知道为什么。我的控制台上没有错误。我正在使用 Vuejs 2.version。 这是我的下拉菜单； <b-dropdown id="benutzer-dropdown" text="Benutzer" class="navbar-item"> <b-dropdown-item href="/main/de/verwaltung/users/">Benutzer verwalten</b-dropdown-item> <b-dropdown-item href="/main/de/verwaltung/roles/">Rollen verwalten</b-dropdown-item> <b-dropdown-item href="/main/de/verwaltung/permissions/">Berechtigungen verwalten</b-dropdown-item> <b-dropdown id="submenu" right> <b-dropdown-item @click="handleSubMenuClick">1</b-dropdown-item> <b-dropdown-item @click="handleSubMenuClick">2</b-dropdown-item> <b-dropdown-item @click="handleSubMenuClick">3</b-dropdown-item> </b-dropdown> </b-dropdown> 和js函数（我只是想测试一下，但是我的控制台里什么也没有） handleSubMenuClick(){ console.log("clicked!!"); }, 看起来您正在尝试使用 b-dropdown 组件在 Vue.js 中实现多级下拉菜单，我认为它是 Bootstrap-Vue 或类似库的一部分。但是，从您的代码片段来看，子菜单下拉列表似乎未正确配置为充当嵌套下拉列表。父下拉列表可以包含嵌套下拉列表，但嵌套下拉列表本身需要正确的设置才能将其内容显示为下拉列表。 以下是如何修改代码以确保嵌套下拉菜单正确运行的方法： 确保正确使用嵌套下拉列表的作用域插槽：在 Bootstrap-Vue 中，如果您使用嵌套下拉列表，通常需要使用作用域插槽来正确渲染嵌套下拉列表及其项目的切换。 如有必要，请使用 b-nav-item-dropdown：如果您位于导航栏上下文中，b-nav-item-dropdown 可能比 b-dropdown 更合适。 确保正确处理点击事件：Vue.js 需要正确定义方法并正确绑定到点击事件。 贝努茨管理 罗伦管理 管理责任 <b-nav-item-dropdown text="Submenu" right> <b-dropdown-item @click="handleSubMenuClick">1</b-dropdown-item> <b-dropdown-item @click="handleSubMenuClick">2</b-dropdown-item> <b-dropdown-item @click="handleSubMenuClick">3</b-dropdown-item> </b-nav-item-dropdown> </b-nav-item-dropdown> 导出默认值{ 方法： { 处理子菜单点击() { console.log("点击了!!"); } } } 主要变化： b-nav-item-dropdown：这用于更好地集成在导航栏中。 嵌套下拉菜单：封装在另一个 b-nav-item-dropdown 中以获得正确的行为。 Vue 方法：确保您的方法在 Vue 实例中正确定义。 最后，如果您正在使用 Bootstrap-Vue，请确保您的 Vue 项目正确导入和配置它。您可能还想检查您的项目设置是否正确包含 Bootstrap CSS 和 JS，以获得正确的下拉功能。

如何为 PrimeNG 下拉列表设置可见/不可见的组项目？

当我单击组标题时，如果组中有项目，我想使组项目可见/不可见。 是否可以？ 例如，我想在下拉列表中看到 3 个项目（AA、BB、CC），前 2 个选项（AA 和 BB）

为什么“Kontakti”的下拉菜单不起作用？

身体 { 字体系列：Arial、无衬线字体； 保证金：0； 填充：0； } #导航栏{ 背景颜色：#f2f2f2； ...</desc> <question vote="1"> <pre><code> &lt;style&gt; body { font-family: Arial, sans-serif; margin: 0; padding: 0; } #navbar { background-color: #f2f2f2; overflow: hidden; text-align: center; } #navbar a { display: inline-block; color: #333; text-align: center; padding: 20px 30px; /* Increased padding for bigger buttons */ text-decoration: none; font-weight: bold; font-size: 20px; /* Increased font size */ } #navbar a:hover { background-color: orange; color: white; } .dropdown { display: inline-block; /* Change float to display */ position: relative; /* Add position relative for dropdown positioning */ } .dropdown .dropbtn { font-weight: bold; border: none; outline: none; color: #333; padding: 20px 30px; /* Increased padding for bigger buttons */ background-color: inherit; font-family: inherit; margin: 0; font-size: 20px; /* Increased font size */ } .dropdown-content { display: none; position: absolute; background-color: #f9f9f9; min-width: 160px; box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); z-index: 1; text-align: left; /* Align dropdown content to the left */ } .dropdown-content a { color: #333; padding: 12px 16px; text-decoration: none; display: block; } .dropdown-content a:hover { background-color: #ddd; } .dropdown:hover .dropdown-content { display: block; } &lt;/style&gt; &lt;/head&gt; &lt;body align=&#34;center&#34; bgcolor=#BCD9DD&gt; &lt;div id=&#34;navbar&#34;&gt; &lt;a href=&#34;AB1.html&#34; class=&#34;active&#34;&gt;Info&lt;/a&gt; &lt;a href=&#34;Ratslaukums.html&#34;&gt;Galerija&lt;/a&gt; &lt;div class=&#34;dropdown&#34;&gt; &lt;button class=&#34;dropbtn&#34;&gt;Kontakti&lt;/button&gt; &lt;div class=&#34;dropdown-content&#34;&gt; &lt;a href=&#34;#&#34;&gt;Adrese&lt;/a&gt; &lt;a href=&#34;#&#34;&gt;Tālrunis&lt;/a&gt; &lt;a href=&#34;#&#34;&gt;E-pasts&lt;/a&gt; &lt;/div&gt; &lt;/div&gt; &lt;a href=&#34;https://www.melngalvjunams.lv/lv&#34;&gt;Par mums&lt;/a&gt; &lt;/div&gt; </code></pre> <p>不要介意大文本，但首先我最终将所有内容都集中在顶部。现在的问题是，我不知道为什么下拉菜单不起作用。</p> <p>我尝试了很多东西，因为在我将其居中之前，一切都运行良好。我不知道该怎么办，我正在向你寻求帮助。在将文本居中之前，一切正常。为什么现在不行了？</p> </question> <answer tick="false" vote="0"> <p>从#navbar<pre>中删除</pre><code>overflow:hidden</code></p> <pre><code>#navbar { background-color: #f2f2f2; text-align: center; } </code></pre> </answer> </body></html>

在 Angular 17 中构建下拉菜单组件

我正在尝试创建一个放置在角度 17 的组件中的下拉菜单。我有一个导航栏，其中仅放置徽标，然后在右侧有组件： 这是 HTML： 我正在尝试创建一个放置在角度 17 的组件中的下拉菜单。我有一个导航栏，其中仅放置徽标，然后在右侧有组件： 这是 HTML： <div class="lang-btn"> <button class="change-lang" (click)="isClicked()"> <img src="../../../assets/navbar/it-button.png" alt="it-IT" class="lang-img" /> </button> </div> <div class="langs-btn" *ngIf="isOpen"> <ul class="lang-ul"> <li class="lang-li"> <button class="change-langs"> <img src="../../../assets/navbar/en-button.png" alt="en-UK" class="lang-img" /> <h6 class="lang">ENGLISH</h6> </button> </li> <li class="lang-li"> <button class="change-langs"> <img src="../../../assets/navbar/es-button.png" alt="es-ES" class="lang-img" /> <h6 class="lang">ESPAÑOL</h6> </button> </li> <li class="lang-li"> <button class="change-langs"> <img src="../../../assets/navbar/fr-button.png" alt="fr-FR" class="lang-img" /> <h6 class="lang">FRANÇAIS</h6> </button> </li> </ul> </div> 这是组件： import { Component } from '@angular/core'; import { CommonModule } from '@angular/common'; @Component({ selector: 'app-dropdown-lang', standalone: true, imports: [ CommonModule ], templateUrl: './dropdown-lang.component.html', styleUrl: './dropdown-lang.component.css' }) export class DropdownLangComponent { isOpen = false; isClicked() { this.isOpen = !this.isOpen } } 为什么没有按预期工作？ PS：如果您在 :hover 上注意到它们并未完全对齐。 px 是对的，但我不知道它为什么不够精确 我一开始尝试使用 bootstrap 但没有成功。我尝试将所有内容都放在 app.component 的导航栏中，但它也不起作用。 下午好， 我正在学习如何使用 ANGULAR，并且遇到了同样的问题：我正在使用 Bootstrap 5.3.3 开发 ANGULAR 17.2.0，并尝试使用 ng-bootstrap (16.0.0)。 这是我的文件所在的位置：https://github.com/Septenia/FilRouge/tree/FilRouge/ChocoPap。 我有以下代码，但它不起作用，我不明白为什么。你能帮忙吗？ 谢谢 import { Component, OnInit } from '@angular/core'; /* Import de ,Input, Output, EventEmitter, output ... */ import { CommonModule } from '@angular/common'; import { NgbModule } from '@ng-bootstrap/ng-bootstrap'; @Component({ selector: 'app-menu', standalone: true, imports: [CommonModule , NgbModule], templateUrl: './menu.component.html', styleUrl: './menu.component.css' }) export class MenuComponent implements OnInit{ pageAffichee: string = 'accueil'; public isCollapsed: boolean = false; constructor() {} ngOnInit() :void { } onAccueil() { this.pageAffichee ='accueil'; } onBoutique() { this.pageAffichee = 'boutique'; } onPanier() { this.pageAffichee = 'panier'; } onCollapse() { if (this.isCollapsed === true) { this.isCollapsed = false } else { this.isCollapsed = true } } } /* ************************************************************************************************* */ /* NAVBARRE */ /* ************************************************************************************************* */ #HMenu, .content{ background-color: var(--miel); display: flex; justify-content: space-between; opacity: 0.8; width: 100%; } #imenuToggle{ color : var(--caramel); font-size: 1.5em; border: none; } #HMenu img { height: 70px; margin: 20px; } #HMenu a:hover { color : var(--chocolatnoir); font-size : 18px; transition:0.4 ease-in-out; } /*Met en évidence le bouton du menu correspondant à la page affichée */ .active { font-size: 20px; font-family: 'Fjalla One'; margin-top: 10px; color : var(--pateasucre) !important; font-weight: bold; text-decoration: none; } #header-right { display: flex; align-items: center; } #header-right p { margin-left: 20px; } #panier{ font-size: 20px; margin-top: 10px; } /* ************************************************************************************************* */ /* AFFICHAGE POUR LES ECRANS DE TAILLE LG ET PLUS */ /* ************************************************************************************************* */ @media screen and (min-width:992px) { } <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script> <!--HEADER BOOTSTRAP --> <header id="entetePrincipale" class="container-fluid m-0 p-0"> <!-- Barre de navigation --> <section id="HMenu" class="navbar navbar-expand-md m-0"> <!--Accessibilité--> <h1 class="accessibility">Menu Principal</h1> <p class="accessibility"><a href="#ContenuPrincipal" title="Accéder directement au contenu principal de cette page">Passer le menu</a></p> <!-- Navbar brand --> <a class="navbar-brand mt-2 mt-lg-0" href="accueil"> <img src="../assets/images/logo.png" alt="Choco PAP Logo"/> </a> <!-- Menu hamburger --> <button id="menuToggle" class="navbar-toggler position-fixed top-0 end-0 z-index-tooltip" type="button" (click)="isCollapsed = !isCollapsed" aria-controls="navbarSupportedContent" [attr.aria-expanded]="!isCollapsed" aria-label="Toggle navigation"> <span class="" role="button" title="Menu"><i class="fa fa-bars" id="imenuToggle"></i></span> </button> <!-- Liste des menus --> <nav role="navigation" [ngbCollapse]="isCollapsed" id="navbarSupportedContent"> <ul class="navbar-nav ms-auto mb-0 "> <li class="nav-item active text-style1"> <a class="nav-link m-0" aria-current="page" href="accueil">Accueil</a> </li> <li class="nav-item text-style1"> <a class="nav-link m-0" href="boutique">Boutique</a> </li> <li class="nav-item Panier"> <a class="nav-link m-0" href="panier">0 &nbsp;<i class="fa-solid fa-cart-shopping" id="panier"></i></a> </li> </ul> </nav> </section> </header>

Excel Ribbon dropDown：设置页面比例值（适用于 mac）

第一个代码允许您在三种页面尺寸之间进行选择。 尝试调整它来设置页面比例值。 问题：DropDown2_onAction 不执行。 页面大小： '——XML 第一个代码允许您在三种页面尺寸之间进行选择。 尝试调整它来设置页面比例值。 问题：DropDown2_onAction不执行。 页面尺寸： ' -- XML <customUI xmlns="http://schemas.microsoft.com/office/2009/07/customui" onLoad="LoadRibbon"> <ribbon> <tabs> <tab id="Tabv3.1" label="TOOLS" insertAfterMso="TabHome"> <group id="GroupDemo2" label="SelectPapersize" imageMso="AddInManager"> <dropDown id="DropDown1" sizeString="xxxx" onAction="DropDown1_onAction" getSelectedItemIndex="DropDown1_GetSelectedItemIndex" > <item id="Item_A3" label="A3"/> <item id="Item_A4" label="A4"/> <item id="Item_A5" label="A5"/> </dropDown> </group> </tab> </tabs> </ribbon> </customUI> ' -- Standard Module Option Explicit Public RibUI As IRibbonUI Sub LoadRibbon(Ribbon As IRibbonUI) Set RibUI = Ribbon RibUI.InvalidateControl "DropDown1" End Sub 'Callback for DropDown1 onAction Sub DropDown1_onAction(control As IRibbonControl, id As String, index As Integer) Dim iSize As Long Select Case Right(id, 2) Case "A3" iSize = xlPaperA3 Case "A4" iSize = xlPaperA4 Case "A5" iSize = xlPaperA5 End Select If iSize > 0 Then _ ActiveSheet.PageSetup.PaperSize = iSize End Sub 'Callback for DropDown1 getSelectedItemIndex Sub DropDown1_GetSelectedItemIndex(control As IRibbonControl, ByRef returnedVal) returnedVal = GetPageSize End Sub Function GetPageSize() As String Select Case ActiveSheet.PageSetup.PaperSize Case xlPaperA3 GetPageSize = 0 ' "A3" Case xlPaperA4 GetPageSize = 1 ' "A4" Case xlPaperA5 GetPageSize = 2 ' "A5" End Select End Function ' -- ThisWorkbook Private Sub Workbook_SheetActivate(ByVal Sh As Object) RibUI.InvalidateControl "DropDown1" End Sub 页面比例： ' -- XML <customUI xmlns="http://schemas.microsoft.com/office/2009/07/customui" onLoad="LoadRibbon"> <ribbon> <tabs> <tab id="Tabv3.1" label="TOOLS" insertAfterMso="TabHome"> <group id="GroupDemo3" label="Page Scale" imageMso="AddInManager"> <dropDown id="DropDown2" sizeString="xxxx" onAction="DropDown2_onAction" getSelectedItemIndex="DropDown2_GetSelectedItemIndex" > <item id="Scale_100" label="100%"/> <item id="Scale_77" label="77%"/> <item id="Scale_68" label="68%"/> </dropDown> </group> </tab> </tabs> </ribbon> </customUI> ' -- Standard Module Option Explicit Public RibUI As IRibbonUI Sub LoadRibbon(Ribbon As IRibbonUI) Set RibUI = Ribbon RibUI.InvalidateControl "DropDown2" End Sub 'Callback for DropDown2 onAction Sub DropDown2_onAction(control As IRibbonControl, id As String, index As Integer) Dim iSize As Long Select Case Right(id, 2) ' id Case "100%" iSize = 100 Case "77%" iSize = 77 Case "68%" iSize = 68 End Select If iSize > 0 Then _ ActiveSheet.PageSetup.Zoom = iSize End Sub 'Callback for DropDown2 getSelectedItemIndex Sub DropDown2_GetSelectedItemIndex(control As IRibbonControl, ByRef returnedVal) returnedVal = GetPageScale End Sub Function GetPageScale() As String Select Case ActiveSheet.PageSetup.Zoom Case 100 GetPageScale = 0 ' "100%" Case 77 GetPageScale = 1 ' "77%" Case 68 GetPageScale = 2 ' "68%" End Select End Function ' -- ThisWorkbook Private Sub Workbook_SheetActivate(ByVal Sh As Object) RibUI.InvalidateControl "DropDown2" End Sub 控件的id属性与之前不同。 使用 Mid 和 InStr 提取缩放比例 Sub DropDown2_onAction(control As IRibbonControl, id As String, index As Integer) Dim iLoc As Long, sZoom As String iLoc = InStr(id, "_") If iLoc = 0 Then Exit Sub sZoom = Mid(id, iLoc + 1) If IsNumeric(sZoom) Then ActiveSheet.PageSetup.Zoom = CInt(sZoom) End Sub

Excel 功能区下拉菜单：将页面比例值设置为 10 到 400（适用于 mac）

此下拉菜单允许您在三个页面比例值之间进行选择。 除了为每个值构建一个“案例”之外，还有其他方法可以为代码提供从 10 到 400 的整个范围吗？...

Excel Ribbon 下拉菜单：设置页面比例值从 10 到 400

此下拉菜单允许您在三个页面比例值之间进行选择。 除了为每个值构建一个“案例”之外，还有其他方法可以为代码提供从 10 到 400 的整个范围吗？...

Excel Ribbon 下拉菜单：设置页面比例值

第一个代码允许您在三种页面尺寸之间进行选择。 尝试调整它来设置页面比例值。 问题：DropDown2_onAction 不执行。 页面大小： '——XML 第一个代码允许您在三种页面尺寸之间进行选择。 尝试调整它以设置页面比例值。 问题：DropDown2_onAction不执行。 页面尺寸： ' -- XML <customUI xmlns="http://schemas.microsoft.com/office/2009/07/customui" onLoad="LoadRibbon"> <ribbon> <tabs> <tab id="Tabv3.1" label="TOOLS" insertAfterMso="TabHome"> <group id="GroupDemo2" label="SelectPapersize" imageMso="AddInManager"> <dropDown id="DropDown1" sizeString="xxxx" onAction="DropDown1_onAction" getSelectedItemIndex="DropDown1_GetSelectedItemIndex" > <item id="Item_A3" label="A3"/> <item id="Item_A4" label="A4"/> <item id="Item_A5" label="A5"/> </dropDown> </group> </tab> </tabs> </ribbon> </customUI> ' -- Standard Module Option Explicit Public RibUI As IRibbonUI Sub LoadRibbon(Ribbon As IRibbonUI) Set RibUI = Ribbon RibUI.InvalidateControl "DropDown1" End Sub 'Callback for DropDown1 onAction Sub DropDown1_onAction(control As IRibbonControl, id As String, index As Integer) Dim iSize As Long Select Case Right(id, 2) Case "A3" iSize = xlPaperA3 Case "A4" iSize = xlPaperA4 Case "A5" iSize = xlPaperA5 End Select If iSize > 0 Then _ ActiveSheet.PageSetup.PaperSize = iSize End Sub 'Callback for DropDown1 getSelectedItemIndex Sub DropDown1_GetSelectedItemIndex(control As IRibbonControl, ByRef returnedVal) returnedVal = GetPageSize End Sub Function GetPageSize() As String Select Case ActiveSheet.PageSetup.PaperSize Case xlPaperA3 GetPageSize = 0 ' "A3" Case xlPaperA4 GetPageSize = 1 ' "A4" Case xlPaperA5 GetPageSize = 2 ' "A5" End Select End Function ' -- ThisWorkbook Private Sub Workbook_SheetActivate(ByVal Sh As Object) RibUI.InvalidateControl "DropDown1" End Sub 页面比例： ' -- XML <customUI xmlns="http://schemas.microsoft.com/office/2009/07/customui" onLoad="LoadRibbon"> <ribbon> <tabs> <tab id="Tabv3.1" label="TOOLS" insertAfterMso="TabHome"> <group id="GroupDemo3" label="Page Scale" imageMso="AddInManager"> <dropDown id="DropDown2" sizeString="xxxx" onAction="DropDown2_onAction" getSelectedItemIndex="DropDown2_GetSelectedItemIndex" > <item id="Scale_100" label="100%"/> <item id="Scale_77" label="77%"/> <item id="Scale_68" label="68%"/> </dropDown> </group> </tab> </tabs> </ribbon> </customUI> ' -- Standard Module Option Explicit Public RibUI As IRibbonUI Sub LoadRibbon(Ribbon As IRibbonUI) Set RibUI = Ribbon RibUI.InvalidateControl "DropDown2" End Sub 'Callback for DropDown2 onAction Sub DropDown2_onAction(control As IRibbonControl, id As String, index As Integer) Dim iSize As Long Select Case Right(id, 2) ' id Case "100%" iSize = 100 Case "77%" iSize = 77 Case "68%" iSize = 68 End Select If iSize > 0 Then _ ActiveSheet.PageSetup.Zoom = iSize End Sub 'Callback for DropDown2 getSelectedItemIndex Sub DropDown2_GetSelectedItemIndex(control As IRibbonControl, ByRef returnedVal) returnedVal = GetPageScale End Sub Function GetPageScale() As String Select Case ActiveSheet.PageSetup.Zoom Case 100 GetPageScale = 0 ' "100%" Case 77 GetPageScale = 1 ' "77%" Case 68 GetPageScale = 2 ' "68%" End Select End Function ' -- ThisWorkbook Private Sub Workbook_SheetActivate(ByVal Sh As Object) RibUI.InvalidateControl "DropDown2" End Sub Sub DropDown2_onAction(control As IRibbonControl, id As String, index As Integer) Dim iLoc As Long, sZoom As String iLoc = InStr(id, "_") If iLoc > 0 Then sZoom = Mid(id, iLoc + 1) If IsNumeric(sZoom) Then ActiveSheet.PageSetup.Zoom = CInt(sZoom) End Sub

连接 Google 表格不同单元格中的下拉列表项

如何连接 Google 表格中不同单元格中的下拉列表项？ 例如：我在单元格 A2 中有一个下拉列表，其中包含以下项目： 苹果 瓜 香蕉 芒果 我想放，我...

Jetpack 为大数据编写 DropdownMenu

我在 DropdownMenu 上加载出价数据时遇到问题。 我的列表中有大约 500 个项目，然后我将其加载到下拉菜单中，这需要一些时间，而且很滞后。 我怎样才能做异步...

我们如何从剧作家中具有多个 div 标签的下拉列表中选择随机文本？

网页元素 是否可以从下拉列表中选择带有 div 标签的“随机”文本？因为我试图使用剧作家中的以下代码从下拉列表中选择任何随机国家/地区： ...

如何在弹出窗口下拉列表中打开模式，然后弹出窗口关闭并且模式传送到页面正文？

我正在使用 VueJS、tailwind css 和 headless ui 创建一个包含模式的弹出窗口下拉列表。 当从下拉列表中选择模态时，下拉列表应关闭，并且模态

将向下箭头添加到标志下拉菜单中

我想在下拉菜单中添加向下箭头？ 我当前的代码在链接中： https://jsfiddle.net/bvotcode/qe6L3bxr/1/ 我的CSS： .flagdropdown { 位置：相对；光标：指针；边框：0.5px 纯灰色；

如何将 CSS 与 Gtk::DropDown 小部件一起使用？

我找不到正确的 CSS 选择器来为 Gtkmm4 DropDown 小部件的主背景区域着色。下拉菜单几乎没有什么影响，因为这个小部件充满了覆盖大部分的子小部件（如果没有......

按指定顺序显示选定的下拉项目

我正在开发一个 React 应用程序，我想构建一个下拉列表，用户可以在其中选择员工的工作日。 我已经使用 NextUI 实现了一个自定义 React 元素，它映射了

在下拉值中显示图像

我尝试创建一个 Dart 多页面应用程序。 我创建了一个从包含表单的抽屉中导航的页面。它里面有一个容器，用于从

如何在选择下拉plaeholder时禁用onClick事件？

我尝试了各种方法来阻止选择任一占位符时发生 onClick 事件，但无法使其正常工作。这是我到目前为止所拥有的： 我尝试了各种方法来阻止选择任一占位符时发生 onClick 事件，但无法使其正常工作。这是我到目前为止所拥有的： <div class="choosesign"> <div class="zodiacs"> <select id="zodiac-me" class="zodiac-me" name="zodiac1"> <option value="none">Your Sign</option> <option value="1">Aries</option> <option value="2">Aquarius</option> <option value="3">Cancer</option> <option value="4">Capricorn</option> <option value="5">Gemini</option> <option value="6">Leo</option> <option value="7">Libra</option> <option value="8">Pisces</option> <option value="9">Sagittarius</option> <option value="10">Scorpio</option> <option value="11">Taurus</option> <option value="12">Virgo</option> </select> </div> <div class="zodiacs"> <select id="zodiac-them" class="zodiac-them" name="zodiac2"> <option value="none">Their Sign</option> <option value="1">Aries</option> <option value="2">Aquarius</option> <option value="3">Cancer</option> <option value="4">Capricorn</option> <option value="5">Gemini</option> <option value="6">Leo</option> <option value="7">Libra</option> <option value="8">Pisces</option> <option value="9">Sagittarius</option> <option value="10">Scorpio</option> <option value="11">Taurus</option> <option value="12">Virgo</option> </select> </div> <div class="zodiacs" id="gobutton"> <a id="zodiacchoice" href="#" onclick='GotoLink()'> <h1> GO</h1> </a> </div> </div> <script>function GotoLink(){ var sel = $('.zodiac-me option:selected').text(); var sel2 = $('.zodiac-them option:selected').text(); if (sel=='Your Sign') { document.getElementById("zodiacchoice").disabled = true; } else { document.getElementById("zodiacchoice").href = '/' + sel + '/' + sel + '-vs-' + sel2; } }</script> 我尝试使用 if 语句进行澄清，但 onClick 并未禁用。该链接仍然可以正常工作。 您可以使用 .val() 来获取所选值。 value中的属性<option>是字符串，使用sel === 'none'。 使用 javascript:void(0) 禁用 <a> function GotoLink() { var sel = $('#zodiac-me').val(); var sel2 = $('#zodiac-them').val(); if (sel === 'none' || sel2 === 'none') { document.getElementById("zodiacchoice").href = 'javascript:void(0)'; } else { document.getElementById("zodiacchoice").href = '/' + sel + '/' + sel + '-vs-' + sel2; } } <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script> <div class="choosesign"> <div class="zodiacs"> <select id="zodiac-me" class="zodiac-me" name="zodiac1"> <option value="none">Your Sign</option> <option value="Aries">Aries</option> <option value="Aquarius">Aquarius</option> <option value="Cancer">Cancer</option> <option value="Capricorn">Capricorn</option> <option value="Gemini">Gemini</option> <option value="Leo">Leo</option> <option value="Libra">Libra</option> <option value="Pisces">Pisces</option> <option value="Sagittarius">Sagittarius</option> <option value="Scorpio">Scorpio</option> <option value="Taurus">Taurus</option> <option value="Virgo">Virgo</option> </select> </div> <div class="zodiacs"> <select id="zodiac-them" class="zodiac-them" name="zodiac2"> <option value="none">Their Sign</option> <option value="Aries">Aries</option> <option value="Aquarius">Aquarius</option> <option value="Cancer">Cancer</option> <option value="Capricorn">Capricorn</option> <option value="Gemini">Gemini</option> <option value="Leo">Leo</option> <option value="Libra">Libra</option> <option value="Pisces">Pisces</option> <option value="Sagittarius">Sagittarius</option> <option value="Scorpio">Scorpio</option> <option value="Taurus">Taurus</option> <option value="Virgo">Virgo</option> </select> </div> <div class="zodiacs" id="gobutton"> <a id="zodiacchoice" href="#" onclick='GotoLink()'> <h1>GO</h1> </a> </div> </div>

如何在4级下拉菜单中添加滚动条[关闭]

我想在桌面模式下的第二个和第三个下拉菜单中添加更多选项，但列表太长。如何设置 y 轴滚动？ 演示 /* 导航栏 ===================================*/ nav.navbar.boo...

我对 gradio.Dropdown 做错了什么？如何动态修改Dropdown的选项？

我想创建一个显示2个下拉列表的渐变WebUI，“rs_hw”根据“rs”值动态变化。我在这里做错了什么？ 将渐变导入为 gr 语言 = ['西班牙语', '英语']

Flutter中如何控制DropdownButtonFormField中DropdownMenuItem的宽度？

我花了很多时间尝试修复展开区域的大小（当您打开 DropdownButtonFormField 时），但它总是占据屏幕的整个宽度 1 2 我的代码是： 下拉按钮FormF...