「IE11でも動く!」都道府県プルダウン
target
<label for="prefId">都道府県</label><select id="prefId"></select>
lodashあり
<!-- https://lodash.com/ -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.15/lodash.min.js"></script>
<!-- https://umbrellajs.com/ -->
<script src="https://cdn.jsdelivr.net/npm/umbrellajs@3.1.0/umbrella.min.js"></script>
<script>
const PREFS = ['北海道','青森県','岩手県','宮城県','秋田県','山形県','福島県','茨城県','栃木県','群馬県','埼玉県','千葉県','東京都','神奈川県','新潟県','富山県','石川県','福井県','山梨県','長野県','岐阜県','静岡県','愛知県','三重県','滋賀県','京都府','大阪府','兵庫県','奈良県','和歌山県','鳥取県','島根県','岡山県','広島県','山口県','徳島県','香川県','愛媛県','高知県','福岡県','佐賀県','長崎県','熊本県','大分県','宮崎県','鹿児島県','沖縄県'];
u(document).on('DOMContentLoaded', function(){
_.each(PREFS, function(p,i){
u('select#prefId').append('<option value="'+_.padStart((i+1), 2, '0')+'">'+p+'</option>')
});
});
</script>
lodashなし
<!-- https://umbrellajs.com/ -->
<script src="https://cdn.jsdelivr.net/npm/umbrellajs@3.1.0/umbrella.min.js"></script>
<script>
const PREFS = ['北海道','青森県','岩手県','宮城県','秋田県','山形県','福島県','茨城県','栃木県','群馬県','埼玉県','千葉県','東京都','神奈川県','新潟県','富山県','石川県','福井県','山梨県','長野県','岐阜県','静岡県','愛知県','三重県','滋賀県','京都府','大阪府','兵庫県','奈良県','和歌山県','鳥取県','島根県','岡山県','広島県','山口県','徳島県','香川県','愛媛県','高知県','福岡県','佐賀県','長崎県','熊本県','大分県','宮崎県','鹿児島県','沖縄県'];
u(document).on('DOMContentLoaded', function(){
PREFS.map(function(nm, i){ u('select#prefId').append('<option value="'+('0'+(i+1)).slice(-2)+'">'+nm+'</option>') });
});
</script>
VanillaJS
document.addEventListener('DOMContentLoaded', function(){
['北海道','青森県','岩手県','宮城県','秋田県','山形県','福島県','茨城県','栃木県','群馬県','埼玉県','千葉県','東京都','神奈川県','新潟県','富山県','石川県','福井県','山梨県','長野県','岐阜県','静岡県','愛知県','三重県','滋賀県','京都府','大阪府','兵庫県','奈良県','和歌山県','鳥取県','島根県','岡山県','広島県','山口県','徳島県','香川県','愛媛県','高知県','福岡県','佐賀県','長崎県','熊本県','大分県','宮崎県','鹿児島県','沖縄県']
.map( function(nm, i){ document.querySelector('select#prefId').insertAdjacentHTML('beforeend', '<option value="'+('0'+(i+1)).slice(-2)+'">'+nm+'</option>') });
});
See the Pen 「IE11でも動く!」都道府県プルダウン by fujisystem (@fujisystem) on CodePen.