Webデザイン
2017年9月17日 日曜日
あまり使う機会はないと思いますが・・・。先日、jQueryでselectにデフォルトとなるoptionを追加する操作をしたときに
HTML
<div id="areaMap">
<select>
<option value="hokkaido">北海道</option>
<option value="aomori">青森</option>
<option value="miyagi">宮城</option>
<option value="akita">秋田</option>
<option value="iwate">岩手</option>
<option value="yamagata">山形</option>
<option value="fukushima">福島</option>
</select>
</div>
jQuery
var areaMap = $('#areaMap > select');
areaMap.prepend('<option value=\"#\">北海道・東北エリア</option>');
と書いたのですが、Internet Explorerだけ期待通りの表示になりません。要素は追加されたものの、ページを表示したときに「北海道・東北エリア」が最初に表示されていない状態になるのですが、jQueryを以下のように書いたらうまくいきました。備忘録として。
jQuery
var areaMap = $('#areaMap > select');
areaMap.prepend('<option value=\"#\">北海道・東北エリア</option>');
areaMap.children('option').attr('selected',false);
areaMap.val('#');
BGM:Storobolight by スーパーカー