DataList的箭头在IE和Firefox不来 [英] Datalist arrow not coming in ie and firefox

查看:596
本文介绍了DataList的箭头在IE和Firefox不来的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

您好,我使用一个datalist标签下拉为在小提琴。我得到的箭头下拉在铬只。和箭头不进来ie和firefox。
在Firefox中搜索是lazy search ie;它不是基于第一个字母

Hi I am using a datalist tag for a dropdown as in the fiddle. I am getting the arrow for dropdown in chrome only. and the arrow is not coming in ie and firefox. In firefox the search is lazy search ie; it is not based on the first letter

小提琴是:: https:// jsfiddle .net / v7fg0zc8 /
请求指定样式(如果有)以实现此

The fiddle is:: https://jsfiddle.net/v7fg0zc8/ pleas specify the styling if any to achieve this

  <!DOCTYPE html>
  <html>
  <body>
      <input list="browsers" name="browser">
      <datalist id="browsers">
      <option value="Internet Explorer"></option>
          <option value="Firefox"></option>
          <option value="Chrome"></option>
          <option value="Opera"></option>
          <option value="Safari"></option>
      </datalist>
  </body>
  </html>

推荐答案

用这个检查。我试过这样可能的方式,但没有很好。可能这是唯一的解决方案

Check with this. I've tried so may ways but not worked well. May be this is the only solution

input::-webkit-calendar-picker-indicator {
  display: none;/* remove default arrow */
}
.myarrow:after {
    content: url(http://s25.postimg.org/6k40u5hcr/arrow.png);
    margin-left: -20px; 
    padding: .1em;
    pointer-events:none;
}

<span class="myarrow"><input list="browsers" name="browser" id="#show-suggestions"></span>
<datalist id="browsers">
  <option value="Internet Explorer"></option>
  <option value="Firefox"></option>
  <option value="Chrome"></option>
  <option value="Opera"></option>
  <option value="Safari"></option>
</datalist>

这篇关于DataList的箭头在IE和Firefox不来的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆