携帯サイトを作るときの selected checked の注意

携帯サイトを最近作ってます。

その際に、PCとは違うサイト構築をしなければならない事がいっぱいあるのですが、そのうちちょっとつまったものを、忘れないようにメモ。

<select name=time2>
    <option value=1>1日</option>
    <option value=2 selected>2日</option>
    <option value=3>3日</option>
</select>

こんなプルダウンメニューを作った場合。
PCだと正常に『2日』が選択されています。
しかし、モバイルで見ると選択されていません。


というのも携帯には、

  • 要素/属性は小文字
  • 空要素以外のタグは省略不可
  • 属性の省略不可

という制限があるのです。


これが正解

<select name=time2>
    <option value=1>1日</option>
    <option value=2 selected="selected">2日</option>
    <option value=3>3日</option>
</select>


checked も同様に、

checked="checked"

です。