javascript - 为什么我的处理程序被多次调用？

Question

当我在日历中放置某些内容时，它会被调用，它会显示一个计划对话框，当我按下该对话框上的按钮时，它会进行 ajax 调用。

我注意到，第一次单击它时，会进行 1 个 ajax 调用，下次按下时，会进行 2 个 ajax 调用，依此类推。

我只需要 1 个 btnSchedule 处理程序:

参见:

  $('#btnSchedule').on('click', function () {

.

 drop: function(date, allDay, ev, ui, resource) { // this function is called when something is dropped

                    // retrieve the dropped element's stored Event Object
                    var originalEventObject = $(this).data('eventObject');

                    // we need to copy it, so that multiple events don't have a reference to the same object
                    var event = $.extend({}, originalEventObject);

                    var obj = this;

                    var hours = 1;

                    var id = event.id;
                    var type = event.type;


                   $('#txtFrom').change(function () {
                       $('#txtHours').val('');
                       fillPriorityList("#<%= ddlPriority.ClientID %>",type + id,resource.id,$('#txtFrom').val());
                    });
                    showScheduler(
                        event.title,
                        $.fullCalendar.formatDate(date,'dddd MMMM dd yyyy'),
                        $.fullCalendar.formatDate(date, 'MM/dd/yyyy'),
                        event.canReoccur,event.reoccurVal,"#<%= ddlPeriod.ClientID %>",
                        "#<%= cbPeriod.ClientID %>");

                    fillPriorityList("#<%= ddlPriority.ClientID %>",type + id,resource.id,$('#txtFrom').val());


                    $('#btnSchedule').on('click', function () {
                        var hrs = $('#txtHours').val();
                        var usingHrs = (isNaN(hrs) == false && hrs > 0);
                        var usingRange = isDateRangeValid('#txtFrom','#txtTo');
                        var canRec = event.canReoccur;
                        var periodChecked = $("#<%= cbPeriod.ClientID %>").prop('checked');
                        var recVal = $("#<%= ddlPeriod.ClientID %>").prop('selectedIndex');
                        var priority = $("#<%= ddlPriority.ClientID %>").val();

                        if(usingHrs || usingRange)
                        {
                            var  f = $.datepicker.parseDate('m/d/yy', $('#txtFrom').val());
                            var  t = $.datepicker.parseDate('m/d/yy', $('#txtTo').val());
                            var correctStart = usingHrs ? date : f;
                            $.ajax({
                                type: "POST",
                                url: "CalendarServices.aspx/RegisterEvent",
                                data: 'id=' + id + '&start=' + $.fullCalendar.formatDate(correctStart, 'yyyy-MM-dd')
                                    + '&end=' + $.fullCalendar.formatDate(t, 'yyyy-MM-dd') + '&type=' + type + '&hours=' + hrs + '&resource=' + resource.id
                                 + '&canRec=' +  canRec + '&periodChecked=' + periodChecked + '&recVal=' + recVal + '&priority=' + priority,

                                success: function (data) {
                                    $(obj).remove();
                                    changeUnscheduledHeaders();
                                    closeScheduler();                              
                                    $('#calendar').fullCalendar('refetchEvents');
                                }
   ,
                                error: function () {
                                }
                            });
                        }

                    })


                }

                ,

我该怎么做才能让它只调用我的 ajax 一次？

谢谢

Answer 1

尝试取消绑定(bind)点击处理程序，然后再次绑定(bind)它

$('#btnSchedule').off('click').on('click'...

如果多次绑定(bind)，则每次绑定(bind)都会执行回调。