2013-11-22 27 views
8
<select name="name"> 
    <option>Select an option.</option><br/> 
    <option>A</option><br/> 
    <option>B</option><br/> 
    <option>C</option><br/> 
</select> 

HTML5, required="required"'a sahiptir ve bu, yukarıdaki açılırken kullanmak istediğim etki türüdür. Kullanıcının "Bir seçenek seç", sadece "A", "B" veya "C" yi seçmesini istemiyorum. Varsayılan bir A değeri ayarlayabildiğimi ve sadece "Bir seçenek belirle" seçeneğini tamamen kaldırabildiğimi biliyorum, ancak kullanıcıların mevcut seçenekleri okumadan gelişigüzel tıklamalarını istemiyorum.İlk seçenek açılır seçenek değil; diğer seçenekleri kullanmak için zorlama

Bu, HTML ve/veya JS ile yapılabilir mi?

+3

sadece merak http://jsfiddle.net/pixshatterer/Q27HX/ demo, hile yapmak gerekir

<select name="name"> <option disabled="disabled" selected="selected">Select an option.</option> <option>A</option> <option>B</option> <option>C</option> </select> 

neden hat seçenekleri arasında içeride kırar var: varsayılan olarak seçilir olarak opsiyon ve ayarlama? – Jerahmeel

+0

HTML5 'required' özniteliği, kullanıcının * bazı * seçeneğini seçmesi gerektiği anlamına gelir. Soru, seçeneklerden birinin devre dışı bırakılmasıyla ilgili gibi görünüyor. –

+0

@ JukkaK.Korpela, evet. A, B ve C seçeneklerine ihtiyacım vardı, ama istediğimin bir örneği gibi. – gator

cevap

9

düzenleme:/Değişikliği göndermek için bu kodu yalnızca ... yerine varsayılan olarak birinin, doğrulama, geçerli bir seçeneği etmeye zorlama olduğu/vb

Sadece ilk devre dışı bırakması gerekir

eklenmelidir burada

+0

Şerefe, sadece HTML ve JS kullanarak bazı basit bir çözüm olduğunu biliyordum. Çok yardımcı oldun! – gator

+1

Hey @riista teşekkürler! – pixshatterer

+1

Bu seçenek, açılır liste değiştirilmediyse gönderilecek 'Bir seçenek belirtilsin' müsaade etmez mi? – Lee

3

option ve disabled=disabled öğelerine yalnızca display:none verin. Teşekkür

http://jsfiddle.net/Xh9nh/4/

EDIT @pixshatterer için: yanlışlıkla visibility:hidden koyun.

+0

Bu en iyi fikir değil, kullanıcılar hala burada görüldüğü gibi "bir seçenek olarak bir seçenek seçin" seçebilecekler: http://jsfiddle.net/Xh9nh/2/ – agconti

+0

@agconti, Hata yaptım, değiştirilen cevabı kontrol et . Görünürlüğü 'gizli' yanlışlıkla koyun. –

+0

@Parto. İyi fikir. İlk tıklamada harika çalışıyor, ancak çevreyi tıklamaya devam ederseniz hala "bir seçenek seç" seçeneğini seçmenize izin veriyor. Bunun neden böyle olduğundan emin değilim. – agconti

2

Eğer (burada: http://jqueryvalidation.org/) Doğrulama eklentisi kullanıyorsanız ve "boş" değeri seçilirse form gönderimini engeller eğer, her <option> üzerinde value tedarik <select> Güncellemenizi:

<select name="name" required> 
    <option value="">Select an option...</option> 
    <option value="A">A</option> 
    <option value="B">B</option> 
    <option value="C">C</option> 
</select> 

Ayrıca değer <select>'un tek geçerli alt öğelerinin <optgroup> veya <option> olduğunu belirterek <br /> s'yi kaldırın.

jQuery bir seçenek değilse, seçime onclick veya form için onsubmit ekleyebilir ve boş bir dizeyi (veya varsayılan değeri ayarladığınız her şeyi) hızlı bir şekilde kontrol edebilirsiniz.

+0

belirtilen @Tieson ile kabul, bu
seçili bir etiket içinde geçersiz işaretleme vardır – pixshatterer

İlgili konular