：：之前也会影响Firefox中的optgroup标签
之前也会影响Firefox中的optgroup标签。
optgroup标签是HTML中的一个元素，用于将相关的选项分组显示在下拉列表中。在Firefox浏览器中，之前存在一个bug，会导致optgroup标签的显示出现问题。
具体来说，当optgroup标签中的选项过多时，Firefox会出现滚动条，但是滚动条无法滚动，导致用户无法查看所有选项。这个bug会影响用户的交互体验和选择操作。
为了解决这个问题，可以通过以下方式来修复：
- 使用CSS样式控制：可以通过设置max-height和overflow属性来控制optgroup标签的显示高度和滚动条的出现。例如：
optgroup {
max-height: 200px;
overflow-y: auto;
}这样设置后，当optgroup标签中的选项超过200px高度时，会出现滚动条，用户可以通过滚动条来查看所有选项。
- 分组减少选项数量：如果optgroup标签中的选项过多，可以考虑将选项进行分组，减少每个optgroup中的选项数量，以避免出现滚动条无法滚动的问题。
总结起来，之前影响Firefox中的optgroup标签的问题是滚动条无法滚动，导致用户无法查看所有选项。可以通过CSS样式控制和分组减少选项数量来解决这个问题。
腾讯云相关产品和产品介绍链接地址：
- 腾讯云官网：https://cloud.tencent.com/
- 云服务器（CVM）：https://cloud.tencent.com/product/cvm
- 云数据库 MySQL 版：https://cloud.tencent.com/product/cdb_mysql
- 云原生应用引擎（TKE）：https://cloud.tencent.com/product/tke
- 云存储（COS）：https://cloud.tencent.com/product/cos
- 腾讯云区块链服务（BCS）：https://cloud.tencent.com/product/bcs
相关·内容
要显示类别列表，我在表单中使用“select”。我插入数据库中的类别。
当我查看select列表时，得到的结果如下所示：
0
art
optgroup有一个带有数字值的标签。我想将标签从列表中删除，这样我就可以在列表中看到：
art
没有来自optgroup标签的0。
谢谢你的建议。
尼基
浏览 1提问于2011-10-01得票数 0
我有以下DOM：
<select>
<optgroup label="a">
<option class="foo">1</option>
<option>2</option>
<option>3</option>
</optgroup>
<optgroup label="b">
<option>1</option>
浏览 0提问于2014-07-07得票数 3
回答已采纳
我有一个这样的optgroup：
<optgroup label="Eller välj Län" title="Eller välj Län" style="background-color:#FC9;">
<option value="Blekinge Län">Blekinge</option>
<option value="Dalarna Län">Dalarna</option>
<option value="Gotland
浏览 0提问于2010-05-17得票数 0
回答已采纳
$("#name option").click(function(){ //some code })
HTML：
<select id = "name">
<optgroup label="label1">
<option>Option a</option>
<option>Option a</option>
</optgroup>
<optgroup label="label2"&g
浏览 3提问于2012-03-16得票数 2
回答已采纳
我有一个javascript，它使select将下拉列表中显示的选定文本设置为所选选项的<optgroup>标签，但当下拉列表打开时，它会将存储在data-content中的文本显示为<optgroup>标签下的选项文本。它在Chrome上运行得很好，但在Firefox上就不行了。当在Firefox中单击选择时，它会以极快的速度打开和关闭，无法进行选择。我注意到，当我注释掉$(this).blur部分时，闪烁停止了，但随后js明显断开了。感谢您能提供的任何帮助！
您可以查看jsfiddle 。
下面是HTML：
<select id="car_choice
浏览 2提问于2020-03-24得票数 0
1回答
我有一些动态创建的选择菜单，有时有一些选项组没有任何选项在里面。
我用一行CSS代码把它们藏起来。它在当时(2016年)的Chrome上运行，但是重新访问我注意到的网站，它已经失效了。
optgroup:empty{display:none}
有什么办法让我知道它是否被否决了吗？如果optgroup标签里面没有任何选项，我应该如何隐藏它们呢？
浏览 1提问于2018-04-08得票数 0
在我的应用程序中，我在一个选项标签上使用了角度(单击)-Event。该事件在Chrome和Firefox中被正确触发。遗憾的是，它没有在IE11中触发。
我的代码如下所示：
<select ...>
<ng-template ngFor ...>
<optgroup ...>
<option ... (click)="fireEvent()">...</option>
</optgroup>
</ng-template>
&
浏览 1提问于2017-11-15得票数 0
我正在尝试创建一个select树结构，它在Chrome中运行良好，但在Firefox中却无法正常工作。下面是Chrome和Firefox的截图。
$('.optgroup').click(function () {
$('option', this).slideToggle()
}).children().click(function (e) {
return false;
});
$( "optgroup" ).click(function
浏览 14提问于2019-08-06得票数 1
回答已采纳
我使用的是角5.x和select标签，optgroup沿侧Bootstrap 4.1.x
我的component.html如下：
<select size="15" class="form-control mr-4">
<optgroup label="Properties">
<option *ngFor="let eachVal of dataResults
浏览 1提问于2018-06-19得票数 0
回答已采纳
我尝试在<select>标签中输入一个包含<optgroup>的padding: 1%;，这在chrome和safari上有效，但在mozilla firefox中不起作用。是否有特定的-moz-类型？要让填充在mozilla中工作吗？谢谢。
浏览 24提问于2016-09-22得票数 1
我对使用jQuery的Opera中的<optgroup>有一个问题。首先，代码如下：
// returns a jQuery optgroup object
function getSpaceOptGroup(locationName) {
var location = locations.first(function(l) {
return l.name == locationName;
});
var optGroup = $("<optgroup label='" + location.name + &#
浏览 4提问于2009-06-10得票数 0
回答已采纳
4回答
我需要去除视光组中的标签。
从这里：
进入这个领域：
但我需要和反政府组织一起这么做。我不想删除它们。
<select>
<optgroup>
<option>1</option>
</optgroup>
<optgroup>
<option>2</option>
</optgroup>
<optgroup>
<option>3</option>
</optgroup>
<optgr
浏览 7提问于2014-07-23得票数 6
回答已采纳
使用简单的select
<select>
<option value="1">One</option>
<option value="2" selected>Two</option>
<option value="3">Three</option>
</select>
<button>Click to wrap</button>
并使用jQuery在optgroup中使用wrapAll选项
$("button&#
浏览 0提问于2016-12-14得票数 0
回答已采纳
以下代码仅在Chrome上获得所需的结果：
HTML：
<select multiple style="width:500px">
<optgroup class="outg" label="Swedish Cars">
<option>1</option>
<option>2</option>
<option>3</option>
</optgroup>
</select>
CSS：
.outg
浏览 1提问于2017-06-05得票数 2
1回答
在我的主css文件中找到了这段代码--不知道它是怎么进来的，也不知道为什么，但它看起来像是重置。最妙的是，即使内容是一个空字符串，它也会完全咀嚼选择的optgroup。
看一看：
<style> *::after,
*::before {
content: '';
}
</style>
<select>
<optgroup label="Swedish Cars">
<option value="volvo">Volvo</option>
<
浏览 1提问于2016-02-14得票数 0
回答已采纳
我创建了带有optgroup的选择框，在开发过程中，我看到在Chrome中，optgroup用1px移动到右边，但在Firefox中显示得很好。
这是我的密码
HTML
<div class="col-xs-6" id="test">
<select aria-invalid="false" class="form-control" multiple="multiple" size="6">
<option value="120">O
浏览 6提问于2016-03-09得票数 0
我有个拉威尔项目。我在vuejs模板中使用了两个optgroup tags.but，如果我使用两个optgroup标签，它只显示第一个optgroup标签标签，而不显示第二个optgroup标签标签或选项标签输出。
我应该怎么做，或者用其他方法来获得相同的结果呢？
<select>
<optgroup label="1st labael">
<optgroup label="2nd label">
<option> some option </o
浏览 0提问于2019-08-26得票数 0
1回答
我正在使用Rails html助手创建一个简单的html结构，其中包含一个label、一个select和optgroups (这是唯一稍微复杂的部分)。
然后我创建了一个名为resources_optgroup的助手。我想要这样的输出：
<div>
<label>Something</label>
<select name="something">
<optgroup label="something">
<option value="
浏览 2提问于2015-09-18得票数 2
回答已采纳
4回答
是否可以在下拉选择器中仅设置optgroup标签的样式？
<select>
<optgroup label="Group Name">
<option>My option</option>
</optgroup>
</select>
浏览 2提问于2011-06-21得票数 16
回答已采纳
如何在html中单击select标记中的optgroup。单击此标签时，应选择其所有子选项。
例如:选择带有标签的optgroup瑞典汽车应该自动选择沃尔沃和萨博的选项。
<select>
<optgroup label="Swedish Cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
</optgroup>
<optgr
浏览 6提问于2016-07-15得票数 0
回答已采纳
3回答
下面select标签在一行中，我需要它在带有select选项标签的三列中：
<select>
<optgroup label="Terestrial">
<option value="Car">Car</option>
<option value="Tank">Tank</option>
</optgroup>
<optgroup label="Air">
<option value="
浏览 1提问于2014-02-13得票数 2
<select>
<optgroup label="Group 1">
<option>Option 1.1</option>
</optgroup>
<optgroup label="Group 2">
<option>Option 2.1</option>
<option>Option 2.2</option>
</optgroup>
<optgroup label="
浏览 0提问于2018-03-31得票数 0
回答已采纳
我有一个选择下拉列表，其中有一些选项和optgroup。我不想使用optgroup的标签。如果我把它设置为空或者没有提到optgroup的属性，我只看到optgroup和option之间的一个空格。有什么办法把它移走吗？这是一把小提琴。
<select>
<option>Category 1</option>
<optgroup>
<option>a</option>
<option>b</option>
</optgroup>
浏览 5提问于2017-07-03得票数 0
我有一个选择结构：
<select id="select-service" class="required span4" multiple="">
<optgroup label="Capelli">
<option selected="false" value="14">Colore capelli</option
</optgroup>
<optgroup la
浏览 4提问于2015-11-13得票数 1
回答已采纳
我有一个HTML元素，它包含一些包含一些<select>元素的<optgroup>元素，如下所示：
<select>
<optgroup label="label1">Label 1
<option>opt1.1</option>
<option>opt1.2</option>
<option>opt1.3</option>
</optgroup>
<optgroup label="label2&#
浏览 0提问于2017-01-18得票数 1
回答已采纳
如果你在选择标签上有一个全局字体家族风格，那么如果在里面有选项组的话，40版的火狐会呈现不同的字体。在旧版本中，外观相似。
我创建了一个来演示这种效果。只需在FF40和旧版本中尝试这个演示。
<style type="text/css">
select { font-family: Arial,Helvetica,sans-serif; }
</style>
<select>
<optgroup label="Group1">
<option value="1"
浏览 4提问于2015-08-31得票数 0
回答已采纳
3回答
我正在寻找一种方法，当用户在多选中选择一个选项并提交它(AJAX)时，多选应该滚动到显示第一个选项(包括optgroup标签)的顶部。
下面是我拥有的当前代码
$('selectId').selectedIndex = 0;
$('selectId').selectedIndex = -1;
这会滚动到选择框中的第一项，但optgroup标签不可见，因为滚动正好在optgroup标签的下方和第一个选项上。
任何关于如何让optgroup标签可见的帮助都会很有帮助。
这里是小提琴：
向下滚动，点击“GoTop”，它会转到"one“，但不会显示optgrou
浏览 0提问于2013-07-02得票数 2
回答已采纳
我有一个下拉式的搜索装置。方法是单击一个选项，然后出现OPTGROUP。我想做的是，一旦标签被选中，它就跳到OPTGROUP的那个部分。
到目前为止，我已经写了一些jQuery。看到这个 -所以一旦你选择了一个主类别。我想让视光组去它的配对标签。我怎样才能做到这一点？
<select id="category" name="category">
<option selected="selected" value="0">Choose a category...</option>
...
浏览 6提问于2012-06-07得票数 6
1回答
我在一个页面上有一个表单，其中包含一个标签和一个选择元素。 <form class="w3-container" style="margin: 0; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);" action="" method="GET">
<label for="instruments" class="w3-text-theme">Select an ins
浏览 31提问于2020-11-16得票数 0
我有一个具有OptGroups的多选择列表，如下所示：
<select multiple="multiple" id="idCountry">
<optgroup label="ASIA">
<option value="AUSTRALIA">AUSTRALIA</option>
<option value="CHINA">CHINA</option>
</optgroup>
<
浏览 3提问于2015-04-28得票数 1
回答已采纳
1回答
我使用mat-optgroup和mat-option来创建一个使用angular material的下拉列表。在一种情况下，我将mat-optgroup的标签设置为空。我不想在这种情况下显示标签。在mat-optgroup中是否有只显示/隐藏标签(而不是它的选项)的选项？ <mat-optgroup [class.active]="attributeGroup.groupName != ''" *ngFor="let attributeGroup of
filteredAttributeList | async"
浏览 16提问于2021-03-26得票数 0
我有一个Symfony表单，其中包含从实体中列出其选项的选择框。但是，如何在手动指定的<optgroup> (optgroup的标签)中列出数据库记录(选项)？
$form = $this->createFormBuilder()
->add('type', EntityType::class, array(
'required' => true,
'class' => 'AppBundle:Types',
'choice_la
浏览 0提问于2018-05-17得票数 2
例如，如果我从数据库中检索到以下数据：
--------------------------
| id | name | department|
--------------------------
| 1 | john | HR |
--------------------------
| 2 | peter| accounting|
--------------------------
| 3 | adam | secretary |
--------------------------
如何创建optgroup标签以在optgroup中显示
浏览 3提问于2013-07-22得票数 0
我有一个包含组标签的下拉列表：
<optgroup label="Numbers">
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
</optgroup>
<optgroup label="Letters" disabled="tru
浏览 1提问于2011-09-24得票数 0
回答已采纳
我正在使用jQuery插件
如果具有以下结构的多重选择：
<select name="search-term[]" multiple="multiple">
<optgroup label="Categories">
<option value="category_4">Internal</option>
<option value="category_2">Business</option>
<optio
浏览 1提问于2016-03-15得票数 5
回答已采纳
1回答
我们在Angular 9应用程序中有一个很大的表单，其中有+30个选择框，每个框中都有+50个选项。在当前版本中，选择只是直接在html中实现，下面的<mat-form-field>只是复制-粘贴+30次。
问题是mat-optgroup i的启动相对较慢，因此引入了一个巨大的性能不足，+30选择单独启动！
所有mat-select使用相同的mat-optgroup，所以我们正在寻找一种解决方案，其中mat-optgroup被初始化一次，并在所有选择中重用？
我们已经尝试了一种从ng-template获取mat-optgroup的解决方案，但没有成功。一种方法是使用ng-conte
浏览 1提问于2020-06-11得票数 1
1回答
如何隐藏选项组/选项元素？
、、、、
有办法隐藏option或optgroup HTML元素吗？我尝试在hide()中调用jQuery，并使用常规Javascript设置style.display='none'。
它在Firefox中工作，但在其他浏览器中不起作用。实际上，从DOM中删除它们是可行的，所以可能有一种方法可以在删除DOM元素时保存它，并将它们重新插入到相同的位置？
我的HTML是这样的：
<select name="propsearch[area]" id="propsearch_area">
<option value="0"
浏览 2提问于2010-04-28得票数 29
回答已采纳
3回答
在HTML中，我们可以编写
<select name="..." value"...">
<optgroup label="Category 1">
<option ... />
<option ... />
</optgroup>
<optgroup label="Category 2">
<option ... />
<option ... />
</optgroup>
</select&g
浏览 2提问于2012-07-19得票数 4
回答已采纳
我对php很陌生，我在HTML表单中有一个组下拉列表，在提交表单之后，我需要获得这个组的名称以及PHP中选择的选项。
<select name="assign_id">
<optgroup label="Admins">
<option value="1">John Smith</option>
<option value="2">Jane Smith</option>
</optgroup
浏览 0提问于2018-12-05得票数 1
回答已采纳
1回答
如何在angular 4中的选择框上获取onchange函数中的optgroup标签值
我有下面的选择框在一个表格中有多个日期作为选项组和24小时格式的时间预订，如上午10点，下午12点和下午2点分别为1000,1200和1400。
<select class="form-control" formControlName="arrival_time" (change)="onSlotChange($event)">
<option value="" data-date=""
浏览 2提问于2018-03-01得票数 4
回答已采纳
2回答
选择optgroup标题作为选项
、、、、
我在下拉列表中有一个这样组织的数据树(但有更多选项)：
pizza
pizza.mediterranean
pizza.veggie
pizza.meatlover
drinks
drinks.soda
drinks.soda.pepsi
drinks.soda.coke
drinks.beer
drinks.water
我希望较大的类别(披萨，饮料)显示为optgroup，但我希望能够选择一个optgroup作为下拉列表中的一个选项。我在多个地方读到的是optgroup只用于分组，不能被选择。
由于我还想要多个级别的缩进，以使下拉列
浏览 0提问于2012-07-14得票数 0
回答已采纳
我不知道如何设置optgroup所选值，确保所选选项具有正确的标签。我遇到的问题是，我有两个标签，但每个标签的选项可能是相同的。
标牌1=本田标牌2=丰田
两者的备选方案：
备选案文1=“红色”备选案文2=“蓝色”
我想将选中的选项设置为document.ready()上本田标签下的Blue。目前，当我尝试将选项设置为选中时，使用" Blue“的最后一项是在本例中选择的项目，即丰田标签下的蓝色。
我试过：
var color ="Blue";
var make ="Honda";
var test = $('#car_selector optgr
浏览 2提问于2014-11-18得票数 3
回答已采纳
1回答
如何将样式放在select标签中的optgroup上？
js：
$('<select></select>').appendTo('body').append('<option value="0">test</option>')
.append($('<optgroup label="group"></optgroup>')
.append('<option value="1
浏览 0提问于2011-08-21得票数 4
回答已采纳
JS
$(function(){
$("select").multiselect();
$( document ).tooltip();
$( document ).tooltip( "option", "position", { my: "left+20 center", at: "right center" } );
});
HTML
<select multiple="multiple" size="5">
<optgroup lab
浏览 5提问于2013-08-08得票数 0
回答已采纳
我有个下坠
<select>
<optgroup label="numbers">
<option>One</option>
<option>Two</option>
<option>Three</option>
</optgroup>
<optgroup label="letters">
<option&
浏览 2提问于2014-06-19得票数 0
回答已采纳
假设我有一个通过Flask传递给jinja2模板的列表：
names = ['Joe', 'Lilly', 'Damion', 'Stephanie', 'Justin']
我遍历了这个列表，并将数据分组到select标记中的不同optgroups中。
jinja2：
<label for="names">Names:</label>
<select id="names">
{% for n in names %}
{% if n ==
浏览 2提问于2017-02-04得票数 1
回答已采纳
3回答
我们使用CSS重置文件来命名从html到p再到img等每个元素，并重置边距、高度、大小等。这是一个非常标准的重置文件。然而，一位客户注意到他们的<sub>和<sup>标签没有显示为下标和上标。因此，我从重置文件中删除了和tag引用，希望能解决这个问题。它已经在FireFox和Safari中修复了这个问题，但它仍然保留在IE6和IE7中。
我是不是漏掉了什么？这些标签是否继承了重置中的另一个标签的样式？而且，有没有办法使用CSS来重做在重置中对<sub>和<sup>标记所做的撤消操作？谢谢你的帮助。
浏览 4提问于2009-10-13得票数 7
如何根据所选的box_B选项获得box_A optgroup的标签名？
我使用以下函数试图提醒box_A父标签，但无法得到它，如果我更改为var label = $(e).attr('value');，则选项值将显示。
function showLabel(e){
if($(e).attr('checked')=='checked'){
var label = $(e).parent().attr('label');
alert(label);
}
}
复选框：
<sel
浏览 1提问于2013-03-25得票数 0
1回答
我正在尝试使用optgroup标签来选择组中的所有选项。 但是，当我同时选择一个组<option>时，它会选择所有的optgroup元素。如何使选择仅基于optgroup标记？ $(document).ready(function() {
$("optgroup").on("click", function() {
$(this).children("option").prop("selected", true);
});
}); <script src="https://cdnjs
浏览 14提问于2019-06-13得票数 0
回答已采纳
我有一个HABTM view，它使用optgroups，以便CakePHP相关标签模型的数据在视图中以分组的方式显示。在照片控制器中，我发送相关的标签模型数据，如下所示，以获得标签类别的optgroup标签分组：
//fields shown to create optgroups eg group tags by category
$this->set('tags', $this->Photo->Tag->find('list', array(
'fields' => array('Tag.id&#
浏览 0提问于2014-07-25得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
腾讯会议
实时音视频活动推荐
腾讯云开发者
