JQuery – Preencher Dropdown com os meses do ano

Mas uma atividade trivial e muito simples de ser implementada.

Implemente um dropdown e atribua a ele um identificador para poder manipulá-lo:

<select id="month"></select>

Em seu arquivo de script, implemente um vetor contendo os nomes dos meses. Implementar um vetor permitirá que você possa aproveitar estes valores futuramente.

var monthNames = [
    'Janeiro', 'Fevereiro', 'Março', 'Abril', 'Maio', 'Junho', 
    'Julho', 'Agosto', 'Setembro', 'Outubro', 'Novembro', 'Dezembro'
];

Agora implemente uma função como no exemplo abaixo que tem como objetivo, usar o vetor criado para preencher dinamicamente o dropdown.

function loadMonth() {
   var dropdown = $('#month');
   dropdown.empty();

   dropdown.prop('selectedIndex', 0);

   $.each(monthNames, function (key, entry) {
      var option = $('<option />');
      option.attr('value', key+1).text(entry);
      dropdown.append(option);
   });
}

Por fim, implemente a chamada para a função. Esta chamada você pode implementar no local que seja melhor para seu contexto. Aqui estou fazendo a chamada assim que o documento estiver completamente carregado.

$(document).ready(function () {
   loadMonth();
});