Jak stworzyć listbox w HTML, nie pozwalając na wielokrotny wybór?

97

Nie mam dużego doświadczenia w HTML. Chcę utworzyć prostą listę, ale jednym z wymagań jest WYŁĄCZENIE wielokrotnego wyboru. Większość kodu list list wygląda tak:

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

Ale to pozwala na wielokrotny wybór.

Tutaj zadano podobne pytanie, ale „najlepsza” odpowiedź została odrzucona. Nie jestem więc pewien, jak inaczej można by to zrobić. Proszę pomóż.

html listbox

— CodeBlue
źródło

5

Jeśli chodzi o innych nowicjuszy, unikajcie wyżej wspomnianej witryny dla własnego dobra - mają dobre SEO, ale to wszystko. Jest pełen złych praktyk i nawyków, których będziesz żałować później. Użyj API z MDN (Mozilla), w tym przypadku developer.mozilla.org/en-US/docs/Web/HTML/Element/select .

— Ben

3

@Steve dzięki za ostrzeżenie. Jego komentarz „To dlatego mam pracę” również okazał się arogancki. Jeśli masz pracę, to dobrze dla ciebie. To jest forum odpowiedzi, a nie reklam.

— CodeBlue,

170

Po prostu użyj atrybutu size:

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

Aby wyjaśnić, dodanie atrybutu rozmiaru nie spowodowało usunięcia wielokrotnego wyboru.

Pojedynczy wybór działa, ponieważ usunąłeś atrybut multiple = "multiple".

Dodanie atrybutu size = "5" jest nadal dobrym pomysłem, oznacza to, że należy wyświetlić co najmniej 5 wierszy. Zobacz pełne odniesienie tutaj

— aaroncatlin
źródło

2

Głosowany za prawdą. Ponadto, gdy pytanie zostało opublikowane wcześniej, to rozwiązanie mogło nie być tak szeroko obsługiwane przez wszystkie przeglądarki.

— aaroncatlin

Prawdopodobnie został odrzucony, ponieważ w standardach HTML nie ma nic, co wymagałoby od przeglądarki renderowania go jako pola listy, jeśli atrybut rozmiaru jest ustawiony. Tak, wszystkie główne przeglądarki obecnie to robią, ale nie ma gwarancji, że zawsze będą. Jednak realistycznie byłaby to przełomowa zmiana dla tak wielu witryn, że żadna przeglądarka prawdopodobnie tego nie zmieni.

— Elezar

1

Standard jest otwarty na małą interpretację: „Rozmiar wyświetlania wybranego elementu jest wynikiem zastosowania reguł analizy nieujemnych liczb całkowitych do wartości atrybutu size elementu , jeśli taki posiada, a jego analiza zakończyła się pomyślnie”. Chociaż nie określa to konkretnie, że powinien być wyświetlany jako lista rozwijana lub pole listy, trudno byłoby wyświetlić kontrolkę rozwijaną, która pokazuje więcej niż 1 element. ( html.spec.whatwg.org/#the-select-element )

— aaroncatlin

Dzięki!! I to może być oczywiście dynamiczne w przypadku Js: D

— Jcc.Sanabria

56

Usuń atrybut multiple = "multiple" i dodaj SIZE = 6 z odpowiednią liczbą elementów

możesz chcieć sprawdzić tę stronę

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

— pollirrata
źródło

2

W przypadku Asp.Net MVC

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

lub

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

— Deshani Tharaka
źródło