複数選択を許可せずにHTMLでリストボックスを作成する方法は？

97

HTMLの経験はあまりありません。シンプルなリストボックスを作成したいと思っていますが、要件の1つは複数選択を無効にすることです。リストボックスのコードのほとんどはこのようになります-

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

ただし、これにより複数選択が可能になります。

ここでは、同様の質問が行われましたが、「最良の」回答は反対投票されました。だから私はこれが他にどのようにできるのかわかりません。助けてください。

html listbox

— CodeBlue
ソース

5

あなたの他の新参者のために、あなた自身のために前述のウェブサイトを避けてください-彼らは良いSEOを持っていますが、それはそれについてです。それはあなたが後で学んだことを残念に思う悪い習慣や習慣に悩まされています。MDN（Mozilla）のAPIを使用します。この場合は、developer.mozilla.org/ en-US/docs/Web/HTML/Element/select です。

— ベン

3

@Steve警告をありがとう。彼のコメント「これが私が仕事をしている理由です」も傲慢なものとして出会いました。あなたが仕事をしているなら、あなたのために良いです。これは回答ではなく、広告のためのフォーラムです。

— CodeBlue 2013年

170

サイズ属性を使用するだけです：

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

明確にするために、サイズ属性を追加しても複数選択は削除されませんでした。

multiple = "multiple"属性を削除したため、単一選択が機能します。

size = "5"属性を追加することもお勧めです。つまり、少なくとも5行を表示する必要があります。ここで完全なリファレンスを参照してください

— アーロンカトリン
ソース

2

真実に賛成。また、以前に質問が投稿されたとき、このソリューションはすべてのブラウザでそれほど広くサポートされていなかった可能性があります。

— aaroncatlin 2013

サイズ属性が設定されている場合、ブラウザがリストボックスとしてレンダリングすることを要求するHTML標準には何もないため、おそらく反対票が投じられました。はい、現在、すべての主要なブラウザでサポートされていますが、常にサポートされる保証はありません。しかし、現実的には、これは非常に多くのWebサイトにとって重大な変更であり、ブラウザーが変更することはないでしょう。

— Elezar 2015

1

標準は少し解釈が自由です。「select要素の表示サイズは、要素のsize属性の値に負でない整数を解析するためのルールを適用した結果、要素が存在する場合、それを解析して成功します。」これは、ドロップダウンまたはリストボックスとして表示する必要があることを明確に述べていませんが、複数の要素を表示するドロップダウンコントロールを表示することは困難です。（html.spec.whatwg.org/#the-select-element）

— aaroncatlin

ありがとう!! そして、これは動的である可能性があります。明らかに、Js：D

— Jcc.Sanabriaによる

56

multiple = "multiple"属性を削除し、必要な要素数でSIZE = 6を追加します

あなたはこのサイトをチェックしたいかもしれません

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

— ポリラタ
ソース

2

Asp.Net MVCの場合

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

または

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

— デシャニタラカ
ソース