2016-02-04 17 views
9

Datalist liste öğesi her zaman görünür olmaya çalışıyorum. Odaklanmış kayıptan sonra standart olarak, ok kaybolur.Datalist ok her zaman görünür olması nasıl yapılır

Hep böyle olmasını istiyorum: 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

ÇEVRE: İşte plunker olan Açısal direktifi

herhangi bir fikir nasıl başarmak için?

En

,

+1

bir datalist eleman yerine seçilmiş bir kullandığınız bir nedeni var mı:

IE ve Firefox için, ben burada cevabını buldu? – JamieC

+0

datalist bu arada Safari tarafından desteklenmiyor –

+0

Olası çoğaltılabilir [HTML5 datalist seçeneklerinde CSS stili uygulamak için bir yol var mı?] (Http://stackoverflow.com/questions/13693482/is-there-a-way -to-apply-a-css-style-on-html5-datalist-seçenekleri) – JamieC

cevap

13

ben var ok her zaman görünür kullanarak 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>

+0

Bu stili jQuery/Javascript kullanarak nasıl ayarlayabilirim? Css'ye (kolayca) erişemediğim bir durumdayım. – abalter

+0

Merhaba. JQuery kullanarak ayarlayamadım. Mozilla kullanıcıları için http://stackoverflow.com/questions/9438949/access-the-webkit-vendor-prefix-in-javascript – amol01

+2

@ amol01 ile ilgili bir fikriniz olabilir mi? "Takvim seçici" göstergesi veya bağlayabileceğiniz uyumluluk tablosu için herhangi bir başvuru sayfanız var mı? Tks – 4lackof

İlgili konular