web-dev-qa-db-ja.com

Datalistの矢印を常に表示する方法

Datalistリスト要素が常に表示されるようにしています。フォーカスを失った後の標準として、矢印は消えます。

私は常にこのようにしたいと思います:ここにプランカーがあります: https://plnkr.co/edit/?p=preview

<input list="browsers" name="myBrowser" />
<datalist id="browsers">
  <option value="Chrome">
  <option value="Firefox">
  <option value="Internet Explorer">
  <option value="Opera">
  <option value="Safari">
</datalist>

enter image description here

環境:Angularディレクティブ

それを達成する方法はありますか?

ベスト、

14
amol01

私はCSSを使用して矢印を常に表示しています:

input::-webkit-calendar-picker-indicator {
              opacity: 100;
           }
    <input list="browsers" name="myBrowser" />
    <datalist id="browsers">
      <option value="Chrome">
      <option value="Firefox">
      <option value="Internet Explorer">
      <option value="Opera">
      <option value="Safari">
    </datalist>
20
amol01

チェックされた回答はChromeでのみ機能します。

IEおよびFirefoxの場合、私はここで答えを見つけました: https://stackoverflow.com/a/39555400/19370

0
ThePhi