web-dev-qa-db-ja.com

デフォルト値を選択せず​​に、必要な選択をどのように設定しますか

私はユーザーに最初のフィールドを使用するのではなく、強制的に選択させようとしています。ユーザーがjavascriptを使用せずにこのフォームを送信しないようにするにはどうすればよいですか?

<select required>
  <option >Make a selection</option>
  <option value="saab">Saab</option>
  <option value="vw">VW</option>
  <option value="audi">Audi</option>
</select> 
19
Daniel

この回答 ごとに、HTML [5のrequired属性を<select>デフォルトを指定した場合<option>空のvalue属性(他の基準については、 the <select> docs )。

選択要素に必須属性が指定され、複数属性が指定されておらず、表示サイズが1の場合。また、select要素のオプションリスト(ある場合)の最初のoption要素の値が空の文字列であり、そのオプション要素の親ノードが(optgroup要素ではなく)select要素である場合、そのオプションはselect要素のプレースホルダーラベルオプション。

だからあなたは望むだろう

<select required>
    <option value="">Make a selection</option>
    <!-- more <option>s -->
</select>

HTML5をサポートしていないという事実を考えると、古いブラウザーにはJavaScriptソリューションが必要になります。

40
ajp15243

selectのHTML5仕様 は、プレースホルダーラベルオプションとして空の文字列の値を持つオプションを定義します。

選択要素に必須属性が指定され、複数属性が指定されておらず、表示サイズが1の場合。およびselect要素のオプションリストの最初のオプション要素の値(存在する場合)が空の文字列であり、そのオプション要素の親ノードがselect要素(optgroup要素ではない)の場合、そのオプションはselect要素のプレースホルダーラベルオプションです。

2
Mark Ignacio

ラベル要素をスタイルできますが、事前に選択されたオプションがあります。

<label>

    Make a selection
    <select>
      <option value="saab" selected>Saab</option>
      <option value="vw">VW</option>
      <option value="audi">Audi</option>
    </select>

</label> 
1
Roko C. Buljan