jQuery UI日期选择器Ajax单击事件

Question

我正在使用jQuery ui datepicker，它通过ajax请求显示不同约会时间的复选框列表。我遇到的问题是，当我点击日期时，会填充时间列表，但复选框上的click事件不会触发。不确定如何使用.on（'click'，function（）[]）;用jQuery ui datepicker。

以下是ajax请求的代码。

$(function() {
    $( "#datepicker" ).datepicker({ 
    onSelect: function(date) {
        $.ajax
        ({
              type: 'POST',
              url: '/member-area/ajax-apt/get-availability',
              data: 'date='+date,
              dataType: 'json',
              success: function(json)
              {
                if (json.status == "success")
                {             
                    var start = json.hours['0']['open'];
                    var end = json.hours['0']['close'];

                    var endDate = new Date(Date.parse(json.date+' '+end));
                    var currentDate = new Date(Date.parse(json.date+' '+start));
                    var availability = [];
                    var html = '<div id="avail-hours"><p>Your Appointment day is on </br><div class="date bg-primary">' + date + '<span id="time"></span></div><h4>Now select the time of your fitness appointment</h4>';


                    while(currentDate < endDate) {
                        var increment = currentDate.setMinutes(currentDate.getMinutes() + 30);

                        currentDate = new Date(increment);
                        html += '<form class="form-inline"><label class="checkbox col-sm-5"><input type="checkbox" name="stime" value="' + formatAMPM(currentDate) + '"> '+ formatAMPM(currentDate) + '</label>';
                    }

                    function formatAMPM(date) {
                      var hours = date.getHours();
                      var minutes = date.getMinutes();
                      var ampm = hours >= 12 ? 'pm' : 'am';
                      hours = hours % 12;
                      hours = hours ? hours : 12; // the hour '0' should be '12'
                      minutes = minutes < 10 ? '0'+minutes : minutes;
                      var strTime = hours + ':' + minutes + ' ' + ampm;
                      return strTime;
                    }

                    html += '</form></div>';
                    $('#avail-hours').replaceWith(html);
                    $('#next').removeClass('hidden');

                    var input_select = $("input[name='stime']:checked")
                    var cnt = input_select.length;

                    if (cnt == 0) 
                    {
                        $('#next').attr('disabled', true);
                    } 
                }
                else
                { 
                  $('p.feedback').addClass('alert alert-error').html(json.message).fadeIn(400, function () {$("p.feedback").delay(5000).fadeOut(400);});
                }
              }
         });  
    },
    minDate:0, 
    maxDate: "+2M +10D" 
});
});