AJAXでjqueryを変更する機能

Question

APIを使用して月ごとに祈りのタイミングを表示します。私は現在の月の祈りのタイミングを表示したいのですが、ページをロードしてコードを与えます。ページが読み込まれるタイミング。ページが読み込まあなたは現在の月にドロップダウンリストを設定し、変更イベントをトリガすることができます

$(document).ready(function() { 
 
    $('.months').change(function() { 
 
     var $month = $('.months').val(); 
 
     var d = new Date(); 
 
     var curr_year = d.getFullYear(); 
 
     var $monthText = $(".months option:selected").text(); 
 
     $('#selected-month').html('Prayer Timings For '+ $monthText); 
 
     function splitTime(time) { 
 
      return time.split(" ", 1); 
 
     } 
 
     $.ajax({ 
 
      method: 'GET', 
 
      url: 'https://api.aladhan.com/calendarByCity?city=Hyderabad\ 
 
      &country=IN&month=' + $month + '&year=' + curr_year + '&method=2&school=1', 
 
      success: function(data) { 
 
       var rowCount = $('#myTable >tbody >tr').length; 
 
       if (rowCount > 0) { 
 
        $("#myTable > tbody > tr").remove(); 
 
       } 
 
       $.each(data.data, function(i, v) { 
 
        var timing = v.timings; 
 
        $('#myTable > tbody:last-child').append('<tr>\ 
 
             <th>' + v.date.readable + '</th>\ 
 
             <th>' + splitTime(timing.Fajr) + '</th>\ 
 
             <th>' + splitTime(timing.Sunrise) + '</th>\ 
 
             <th>' + splitTime(timing.Dhuhr) + '</th>\ 
 
             <th>' + splitTime(timing.Asr) + '</th>\ 
 
             <th>' + splitTime(timing.Maghrib) + '</th>\ 
 
             <th>' + splitTime(timing.Isha) + '</th>\ 
 
             </tr>'); 
 

 
       }) 
 
      }, 
 
      error: function(data) { 
 
       alert('There is no response from server side'); 
 
      } 
 
     }); 
 
    })

<form> 
 
    <select class="form-control months"> 
 
     <option>Select Month</option> 
 
     <option value="01">January</option> 
 
     <option value="02">February</option> 
 
     <option value="03">March</option> 
 
     <option value="04">April</option> 
 
     <option value="05">May</option> 
 
     <option value="06">June</option> 
 
     <option value="07">July</option> 
 
     <option value="08">August</option> 
 
     <option value="09">September</option> 
 
     <option value="10">October</option> 
 
     <option value="11">November</option> 
 
     <option value="12">December</option> 
 
    </select> 
 
</form>

Answer 1

。あなたの$(document).Ready()

の終わりにすることを入れて

JSFiddle

//Date.getMonth returns 0-11 

var month = new Date().getMonth() + 1; 
if (month < 10) { 
    month = "0" + month; 
} 
$('.months').val(month).trigger("change");