Birden fazla seçime izin vermeden HTML'de bir liste kutusu nasıl oluşturulur?

97

HTML konusunda pek tecrübem yok. Basit bir liste kutusu oluşturmak istiyorum, ancak gereksinimlerden biri çoklu seçimi DEVRE DIŞI BIRAKMAK. Liste kutuları için kodun çoğu şu şekildedir -

 <select name="sometext" multiple="multiple">
    <option>text1</option>
    <option>text2</option>
    <option>text3</option>
    <option>text4</option>
    <option>text5</option>
 </select>

Ancak bu, çoklu seçime izin verir.

Burada da benzer bir soru soruldu, ancak "en iyi" yanıt reddedildi. Bu yüzden bunun başka nasıl yapılabileceğinden emin değilim. Lütfen yardım et.

html listbox

— Mavi Kod
kaynak

5

Diğer yeni gelenler için, lütfen yukarıda belirtilen web sitesinden kendi iyiliğiniz için kaçının - iyi bir SEO'ya sahipler ama hepsi bu. Kötü uygulamalar ve alışkanlıklarla dolu, daha sonra öğrendiğin için pişman ol. MDN'den (Mozilla) API'yi kullanın, bu durumda developer.mozilla.org/en-US/docs/Web/HTML/Element/select .

— Ben

3

@Steve uyarı için teşekkürler. "İşte bu yüzden bir işim var" yorumu da kibirli geldi. Bir işin varsa, senin için iyi. Bu, reklamlar için değil, cevaplar için bir forumdur.

— CodeBlue

170

Sadece beden özelliğini kullanın:

<select name="sometext" size="5">
  <option>text1</option>
  <option>text2</option>
  <option>text3</option>
  <option>text4</option>
  <option>text5</option>
</select>

Açıklığa kavuşturmak gerekirse, beden özelliğini eklemek çoklu seçimi kaldırmadı.

Tek seçim, multiple = "multiple" özelliğini kaldırdığınız için çalışır.

Size = "5" özelliğini eklemek hala iyi bir fikirdir, en az 5 satırın görüntülenmesi gerektiği anlamına gelir. Tam referansa buradan bakın

— Aaroncatlin
kaynak

2

Hakikat için oy verildi. Ayrıca, soru daha önce gönderildiğinde, bu çözüm tüm tarayıcılar tarafından yaygın olarak desteklenmemiş olabilir.

— aaroncatlin

Büyük olasılıkla, HTML standartlarında, size özelliği ayarlanmışsa, tarayıcının onu liste kutusu olarak oluşturmasını gerektiren hiçbir şey olmadığı için olumsuz oy verildi. Evet, şu anda tüm büyük tarayıcılar bunu yapıyor, ancak her zaman olacaklarının garantisi yok. Gerçekçi olsa da, bu pek çok web sitesi için önemli bir değişiklik olacaktır, hiçbir tarayıcının bunu değiştirmesi mümkün değildir.

— Elezar

1

Standart küçük bir yoruma açıktır: "Bir seçme öğesinin görüntü boyutu, negatif olmayan tam sayıları , varsa öğenin boyut özniteliğinin değerine ayrıştırmaya yönelik kuralların uygulanmasının sonucudur ve ayrıştırma başarılı olur." Bu, özellikle bir Açılır Menü veya Liste Kutusu olarak görüntülenmesi gerektiğini belirtmese de, 1'den fazla öğeyi gösteren bir Açılır Menü denetimini görüntülemek zor olacaktır. ( html.spec.whatwg.org/#the-select-element )

— aaroncatlin

Teşekkürler!! Ve bu açıkça Js: D

— Jcc.Sanabria

56

Multiple = "multiple" özelliğini kaldırın ve istediğiniz öğe sayısıyla SIZE = 6 ekleyin

bu siteyi kontrol etmek isteyebilirsin

http://www.htmlcodetutorial.com/forms/_SELECT.html

— Polirrata
kaynak

2

Asp.Net MVC için

@Html.ListBox("parameterName", ViewBag.ParameterValueList as MultiSelectList, 
 new { 
 @class = "chosen-select form-control"
 })

veya

  @Html.ListBoxFor(model => model.parameterName,
  ViewBag.ParameterValueList as MultiSelectList,
   new{
       data_placeholder = "Select Options ",
       @class = "chosen-select form-control"
   })

— Deshani Tharaka
kaynak