下拉列表在 Firefox 中不可见
Posted
技术标签:
【中文标题】下拉列表在 Firefox 中不可见【英文标题】：Dropdown list not visible in Firefox 【发布时间】：2015-03-03 23:51:05 【问题描述】：我有一个下拉列表，其中包含在 Firefox 中不可见但在 IE 和 Chrome 中可见的选项。我在下面添加了代码sn-p。
<!DOCTYPE html>
<html>
<head>
<title>Mozilla Test</title>
</head>
<body>
<select id="product" name="product" title="Product" tabindex="14" style="padding-top:1px!important;padding-bottom:1px!important;width:100px;>
<option value="selectFruit" label="--Select--"></option>
<option value="APP" label="Apple"></option>
<option value="BAN" label="Banana"></option>
<option value="GRA" label="Grapes"></option>
</select>
</body>
</html>谁能帮我解决这个问题。
【问题讨论】：
在 Chrome 中发生在我身上 - 问题是我忘记添加 【参考方案1】：这似乎是 Firefox 中的一个错误。 (https://bugzilla.mozilla.org/show_bug.cgi?id=40545#c11)
我假设您已尝试将标签添加为选项元素的内容？
<!DOCTYPE html>
<html>
<head>
<title>Mozilla Test</title>
</head>
<body>
<select id="product" name="product" title="Product" tabindex="14" style="padding-top:1px!important;padding-bottom:1px!important;width:100px;>
<option value="selectFruit" label="--Select--"></option>
<option value="APP" label="Apple">Apple</option>
<option value="BAN" label="Banana">Banana</option>
<option value="GRA" label="Grapes">Grapes</option>
</select>
</body>
</html>【讨论】：
它可能有效，但我从后端代码获取选项的 html 内容，所以这将是我最后的手段。 @naXa 这是一个公平的观点，但它仍然没有解决，可以修复。【参考方案2】：你必须在
中写入值<option value="APP" label="Apple">Apple</option>
【讨论】：
它可能有效，但我从后端代码获取选项的 html 内容，所以这将是我最后的手段。【参考方案3】：这是 Firefox 中一个未解决的老问题，但假设您可以使用 jQuery，分享一个为我完成工作的快速解决方法。在我的 aspx 页面中使用了多个选择元素，如下所示 -
<select id="cbType" runat="server" class="form-control"
title="<%$ Resources: Something %>">
<option value="0" selected="selected" label="<%$ Resources: Option1 %>" runat="server"></option>
<option value="1" label="<%$ Resources: Option2 %>" runat="server"></option>
<option value="2" label="<%$ Resources: Option3 %>" runat="server"></option>
<option value="3" label="<%$ Resources: Option4 %>" runat="server"></option>
<option value="4" label="<%$ Resources: Option5 %>" runat="server"></option>
</select>
现在只需从 jQuery(document).ready() 调用下面的方法。
function fixFirefoxDropdownIssue()
jQuery('select option').each(function()
jQuery(this).text(jQuery(this).attr('label'));
);
它基本上将选项的内部文本设置为标签属性指定的值。如果需要，您可以更改 jQuery 选择器以使其更具体。
这样，您不必更改任何服务器端数据标签。已在 Firefox 40.0.3 中对此进行了测试。
【讨论】：
以上是关于下拉列表在 Firefox 中不可见的主要内容，如果未能解决你的问题，请参考以下文章