怎么做 <select>元素不選擇默認選擇的第一個選項？

Question

我正在使用jquery相互依賴庫來構建復雜的表單（當你顯示字段依賴於來自其他字段的值時）。

所以，我有<select>元素

<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>

如果用戶選擇選項“01”，那么我應該顯示另一個字段“TypeDescription”，用戶可以在其中描述他的專有id方案。 如果用戶從select中選擇任何其他選項 - 將不會出現“TypeDescription”字段。

事情就是第一個選擇

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

在打開頁面時始終默認選中，因此始終顯示“TypeDescription”字段。

有沒有辦法取消選擇<select>元素的所有選項？ 我的目標是當用戶打開頁面時，他不應該看到字段“TypeDescription”。

附JSFiddle

Answer 1

唯一的方法是添加一個空選項。

<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>

<select>總是有選擇的東西; 如果用戶沒有與控件交互，並且<option>元素都沒有“selected”屬性，則選擇第一個。

我很確定“占位符”對<select>元素沒有任何作用。

Answer 2

在頂部添加一個沒有值的選項。 placeholder屬性不適用於選擇框。

<select id="form_product_id_type" name="form_product_id_type">
    <option value="">Select Product ID</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>