如何可靠地隱藏 HTML5 選擇選單中的選項？

使用CSS 在HTML5 選擇選單中隱藏選項

儘管能夠隱藏 Firefox 中的元素使用display: none; CSS、Chrome 提出了一個挑戰，即按一下 後會顯示隱藏選項。菜單。這就提出瞭如何有效隱藏符合搜尋條件的選項，同時防止它們在開啟功能表時重新出現的問題。

解決方案：利用隱藏屬性

對於 HTML5 相容的瀏覽器，隱藏屬性提供了有效的解決方案。此屬性從視圖和選擇中隱藏該選項，確保無論選單互動如何，它都保持不可見。

<option hidden>Hidden Option</option>

要注意的是，11 以下的 IE 版本不支援隱藏屬性。但是，如果您主要關心的是隱藏少量選項，那麼與涉及添加或刪除元素或違反語義的更複雜技術相比，組合隱藏和停用屬性可提供實用的解決方案約定。

  Option1
  Option2
  <option hidden>Hidden Option</option>

以上是如何可靠地隱藏 HTML5 選擇選單中的選項？的詳細內容。更多資訊請關注PHP中文網其他相關文章！