如何在HTML中的选择（下拉）菜单中设置不可选择的默认描述？

我有一个下拉其中用户选择的语言：如何在HTML中的选择（下拉）菜单中设置不可选择的默认描述？

<select> 
    <option>English</option> 
    <option>Spanish</option> 
</select>

我想这是最初显示的说默认选项“选择语言”，而不是“英语”（我的第一选择，默认显示为）。
我不希望用户能够选择“选择语言”。

来源

2011-03-06 RSM

我可能是错的，但我觉得OP是为了问如何显示一些文本，不属于选项，像这样的：[链接]（http://stackoverflow.com/questions/9447134/HTML的选择 - 如何到组默认的文本 - 这-不会待显示功能于下拉列表）。 Oded和Myles的答案都是针对你想要显示其中一个选项的情况。顺便说一下，我不认为把它作为迈尔斯解决方案中的第一种选择是一个很好的设计。但这只是我个人的意见。 – 2012-08-24 19:22:26

@YangChi同意。提交编辑问题。 – JBallin 2018-01-11 23:02:28

如果select中的选项都没有selected属性，则第一个选项将是所选的一个。

为了选择是不是第一个默认选项，一个selected属性添加到该选项：

<option selected="selected">Select a language</option>

您可以阅读选择元素的HTML 4.01 spec关于违约。

如果您需要学习像这样的HTML基础知识，我建议您阅读一本好的HTML书 - 我推荐Head First HTML。

来源

2011-03-06 19:50:09 Oded

只是要选择1选择语言：

Live Demo

来源

2011-03-06 19:51:15

大厦俄德的回答，您还可以设置默认选项，但不能让它可以选择的，如果它只是虚拟文本。例如，你可以这样做：

<option selected="selected" disabled="disabled">Select a language</option>

这将显示“选择语言”用户点击选择框，但用户将无法选择，因为残疾人属性之前。

来源

2013-05-13 14:51:23

我认为将'selected =“选中的”''选中“会更简单。相同的'禁用'。提交编辑。请注意，如果使用解析器包含值，则可以使用另一个答案：“我写的内容是有效的多边形HTML/XML。对于浏览器，使用<选项选择>可以，但可能会导致文档被拒绝其他解析器“ – JBallin 2018-01-11 23:36:07

.selectmenu{ 
 
    
 
\t -webkit-appearance: none; /*Removes default chrome and safari style*/ 
 
\t -moz-appearance: none; /* Removes Default Firefox style*/ 
 
\t background: #0088cc ; 
 
\t width: 200px; /*Width of select dropdown to give space for arrow image*/ 
 
\t text-indent: 0.01px; /* Removes default arrow from firefox*/ 
 
\t text-overflow: ""; /*Removes default arrow from firefox*/ /*My custom style for fonts*/ 
 
\t color: #FFF; 
 
\t border-radius: 2px; 
 
\t padding: 5px; 
 
    border:0 !important; 
 
\t box-shadow: inset 0 0 5px rgba(000,000,000, 0.5); 
 
} 
 
.hideoption { display:none; visibility:hidden; height:0; font-size:0; }

Try this html 
 

 
<select class="selectmenu"> 
 
<option selected disabled class="hideoption">Select language</option> 
 
<option>Option 1</option> 
 
<option>Option 2</option> 
 
<option>Option 3</option> 
 
<option>Option 4</option> 
 
<option>Option 5</option> 
 
</select>

来源

2015-07-10 03:36:57 Ashok

<option value="" selected disabled hidden>Default Text</option>

离开禁用标志防止他们不选择一个选项，隐藏标志将从列表中删除。在我来说，我是用它的枚举列表，以及和概念持同样

<select asp-for="Property" asp-items="Html.GetEnumSelectList<PropertyEnum>()"> 
         <option value="" selected disabled hidden>Select Property Enum</option> 
         <option value=""></option> 
        </select>

来源

2017-07-12 20:36:43 Chris

”隐藏“在所有浏览器中都不起作用，但如果您希望某些浏览器不显示该选项，则将它放在那里并没有什么坏处。我认为在这种情况下，在查看选项时有“指令”是很好的。 – JBallin 2018-01-11 23:38:57

把你的提示在第一option并禁用它：

<selection> 
    <option disabled selected>”Select a language”</option> 
    <option>English</option> 
    <option>Spanish</option> 
</selection>

第一个选项将自动选定的默认值（当您查看下拉列表时首先看到的内容），但添加selected属性时更加清楚并且实际需要第一个字段为禁用字段时。

disabled属性将使选项变为不可选/变灰。

其他答案建议设置disabled=“disabled”，但如果你需要解析为XHTML，这基本上是HTML的一个更严格的版本，这只是必要的。标准HTML上的disabled就足够了。

我F你想使“需要”时，选择（不接受“选择语言”选项作为一个公认的答案）：

的required属性添加到selection并设置第一option的value空字符串””。

<selection required> 
    <option disabled value=“”>Select a language</option> 
    <option>English</option> 
    <option>Spanish</option> 
</selection>

来源

2018-01-12 06:16:52 JBallin

如何在HTML中的选择（下拉）菜单中设置不可选择的默认描述？

回答

相关问题