2012-12-11 29 views
0

日历页:jQuery Mobile的和变化的翻页功能,双岗要求

$(document).delegate('#ViewOrders', 'pageinit', function() { 
    var ordersSource, calendar; 
    var ordersParams = new Object(); 
    var tonnageParams = new Object(); 
    if (parseInt($("#ddlRooms").val()) > 0) { 
     tonnageParams.RoomId = $("#ddlRooms").val(); 
    } 

    $.post('/AdminPages/Mobile/Ajax/Ajax.ashx?p=GetTonnage', tonnageParams, function (data) { 
     ordersSource = data; 

     setTimeout(function() { 
      calendar = $("#calendar").fullCalendar({ 
       header: { 
        left: 'prev,next today', 
        center: '', 
        right: 'title' 
       }, 
       isRTL: false, 
       theme: true, 
       selectable: true, 
       select: function (start, end, allDay) { 
        ordersParams.Start = getDateString(start); 
        ordersParams.End = getDateString(end); 

        if ($("#ddlRooms").val() > 0) { 
         ordersParams.RoomId = $("#ddlRooms").val(); 
        } 
        else { 
         delete ordersParams.RoomId; 
        } 

        $.mobile.changePage("ShowOrders.aspx", { data: ordersParams, transition: 'slide', rel: 'dialog' }); 
       calendar.fullCalendar('destroy'); 
       }, 
       events: ordersSource 
      }); 
     }, 500); 
    }); 

    $("#ddlRooms").change(function() { 
     var elem = $(this); 

     calendar.fullCalendar('removeEventSource', ordersSource); 
     tonnageParams = new Object(); 

     if (parseInt(elem.val()) > 0) { 
      tonnageParams.RoomId = elem.val(); 
     } 

     $.post('/AdminPages/Mobile/Ajax/Ajax.ashx?p=GetTonnage', tonnageParams, function (data) { 
      ordersSource = data; 
      calendar.fullCalendar('addEventSource', ordersSource); 
     }); 
    }); 
}); 

结果页:

$(document).delegate('#ViewOrders', 'pageinit', function() { 
$("#btnBack").click(function() { 
    var id = $(this).data('backid'); 
    $.mobile.changePage("ViewOrders.aspx", { data: { RoomId: id }, reloadPage: true, transition: 'slide', reverse: true }); 
}); 
}); 

(该脚本位于在一个文件中,并上传在生活的开始该应用程序并不会加载任何页面。)

我想要做的是有一个带日历的页面。选择日期时,用户转到其他日期选择参数。 在第二页上,他看到当天的订单。 它也有一个回到日历的按钮。我的问题是,当他回到选择“ddlRooms”的日历更改事件时,“发布”会发生两次。我试图做到这一点:

$("#ddlRooms").unbind('change').change(function() { 
... 
}); 

但用户界面然后选择无法正常工作。

回答

1

有一个替代事件绑定/解除绑定和开/关。在你再次使用jQuery事件过滤器绑定它之前,甚至不要解除绑定,而是使用jQuery事件过滤器来识别事件是否已被绑定。

http://www.codenothing.com/archives/2009/event-filter/

这是我的使用示例:

$('#carousel div:Event(!click)').each(function(){ 

}); 

我使用的每一个,因为我的旋转木马div有许多内在的块,但原理是一样的。如果#carousel内部div元素没有点击事件,请添加他们的事件。在你的情况下,这将防止多个事件绑定(如果这是你的问题)。