如何使数据列表箭头始终可见

Question

我试图让 datalist 列表元素始终可见。作为标准，失去焦点后，箭头消失。

我希望它总是这样：这是 plunker：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>

环境：Angular 指令

有什么实现方法吗？

最佳，

Answer 1

我使用 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>

如何使数据列表箭头始终可见

How to make Datalist arrow to be always visible

html

css

html-datalist