web-dev-qa-db-ja.com

<複数選択>-選択したアイテムを1つだけ許可する方法

複数のオプションを持つ<SELECT multiple>フィールドがあり、同時に1つのオプションのみを選択できるようにしますが、ユーザーはCtrlキーを押しながら複数のアイテムを一度に選択できます。

それを行う方法はありますか? (「複数」を削除したくない)。

129
simPod

単に複数選択するのではなく、次のようにサイズを設定します。

  <select name="user" id="userID" size="3">
    <option>John</option>
    <option>Paul</option>
    <option>Ringo</option>
    <option>George</option>
  </select>

作業例: https://jsfiddle.net/q2vo8nge/

268
Marcos Placona

ユーザーが一度に1つのオプションのみを選択する必要がある場合は、「複数」を削除するだけです。通常の選択を行います。

  <select name="mySelect" size="3">
     <option>Foo</option>
     <option>Bar</option>
     <option>Foo Bar</option>
     <option>Bar Foo</option>
  </select>

フィドル

24
MacGucky

multiple属性を削除したくないのはなぜですか?その属性の全体的な目的は、指定されたselect要素から複数の値を選択できることをブラウザに指定することです。単一の値のみを選択する必要がある場合は、属性を削除すると、ブラウザーは単一の選択のみを許可することを認識します。

持っているツールを使用してください、それが彼らの目的です。

9
David

私はselect\multi-selectでいくつかの取引をしましたが、これが私にとってのトリックでした

<select name="mySelect" multiple="multiple">
    <option>Foo</option>
    <option>Bar</option>
    <option>Foo Bar</option>
    <option>Bar Foo</option>
</select>
1
Ewan
<select name="flowers" size="5" style="height:200px">
 <option value="1">Rose</option>
 <option value="2">Tulip</option>
</select>

このシンプルなソリューションにより、オプションのリストを視覚的に取得できますが、選択できるのは1つだけです。

1
Ste

デフォルトでは1つのオプションのみが必要ですが、ユーザーはCtrlキーを押して複数のオプションを選択できます。これは(すでに)SELECT multipleの動作を正確に意味しています。

これを参照してください: http://www.w3schools.com/tags/tryit.asp?filename=tryhtml_select_multiple

質問を明確にしてください。

1
Cogicero

私はグーグルを検索し、私の終わりに物事を変更した後、ここに来ています。

したがって、このサンプルを変更するだけで、実行時にjqueryで動作します。

$('select[name*="homepage_select"]').removeAttr('multiple')

http://jsfiddle.net/ajayendra2707/ejkxgy1p/5/

1
Ajay2707