如何制作< select>元素不选择默认选择的第一个选项？ [英] How to make <select> element not to choose first option as selected by default?

问题描述

我正在使用 jquery interdependencies library 来构建复杂的表单（当你显示字段依赖于来自其他领域的价值）。

所以，我有< select> 元素

 < select placeholder =Select Product ID Typeid =form_product_id_typename =form_product_id_type> 
< option label =01  -  Proprietaryvalue =01> 01  -  Proprietary< / option> 
< option label =02  -  ISBN-10value =02> 02  -  ISBN-10< / option> 
< option label =03  -  GTIN-13value =03> 03  -  GTIN-13< / option> 
< option label =04  -  UPCvalue =04> 04  -  UPC< / option> 
< option label =05  -  ISMN-10value =05> 05  -  ISMN-10< / option> 
 ... 
< / select> 
  

如果用户选择选项01，那么我应该显示另一个字段TypeDescription，用户可以在其中描述他的专有ID方案。如果用户从select中选择任何其他选项 - TypeDescription字段将不会出现。

事情是第一个选项

 < option label =01  -  Proprietaryvalue =01> 01  -  Proprietary< / option>打开页面时，默认情况下始终选择
  

，因此始终会显示TypeDescription字段。 / p>

有没有办法取消选择< select> 元素中的所有选项？我的目标是当用户打开页面时，他不应该看到字段TypeDescription。

附 JSFiddle

解决方案

唯一的方法是添加一个空选项。

 < select placeholder =Select Product ID Typeid =form_product_id_typename =form_product_id_type> 
< option selected value =>选择产品ID类型< / option> 
< option label =01  -  Proprietaryvalue =01> 01  -  Proprietary< / option> 
< option label =02  -  ISBN-10value =02> 02  -  ISBN-10< / option> 
< option label =03  -  GTIN-13value =03> 03  -  GTIN-13< / option> 
< option label =04  -  UPCvalue =04> 04  -  UPC< / option> 
< option label =05  -  ISMN-10value =05> 05  -  ISMN-10< / option> 
 ... 
< / select> 
  

A < select> 总有一些东西选择;如果用户未与控件进行交互，并且< option> 元素都没有selected属性，则会选择第一个。

我很确定占位符在< select> 元素上什么都不做。

I'm using jquery interdependencies library for building complex form (when you show fields depend on values from other fields).

So, I have <select> element

<select placeholder="Select Product ID Type" id="form_product_id_type" name="form_product_id_type">
    <option label="01 - Proprietary" value="01">01 - Proprietary</option>
    <option label="02 - ISBN-10" value="02">02 - ISBN-10</option>
    <option label="03 - GTIN-13" value="03">03 - GTIN-13</option>
    <option label="04 - UPC" value="04">04 - UPC</option>
    <option label="05 - ISMN-10" value="05">05 - ISMN-10</option>
    ...
</select>

If user selects option "01" then I should show another field "TypeDescription" where user can describe his proprietary id scheme. If user selects any other options from select -"TypeDescription" field will not appear.

The thing is that first option

<option label="01 - Proprietary" value="01">01 - Proprietary</option>

is always selected by default when you open a page and therefore field "TypeDescription" is shown always.

Are there any ways to unselect all options from <select> element? My goal is when user open page he should not see field "TypeDescription".

Attached JSFiddle

解决方案

The only way to do that is to add an empty option.

<select placeholder="Select Product ID Type" id="form_product_id_type" name="form_product_id_type">
    <option selected value="">Select Product ID Type</option>
    <option label="01 - Proprietary" value="01">01 - Proprietary</option>
    <option label="02 - ISBN-10" value="02">02 - ISBN-10</option>
    <option label="03 - GTIN-13" value="03">03 - GTIN-13</option>
    <option label="04 - UPC" value="04">04 - UPC</option>
    <option label="05 - ISMN-10" value="05">05 - ISMN-10</option>
    ...
</select>

A <select> always has something selected; if the user hasn't interacted with the control, and none of the <option> elements have the "selected" attribute, then the first one is selected.

I'm pretty sure that "placeholder" does nothing on <select> elements.

这篇关于如何制作< select>元素不选择默认选择的第一个选项？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！