jQuery选择器与jquery-mobile datepicker不能很好地工作

Question

在我的html中，我有两个不同的日期选择器，在两个不同的divs内。我想从日期选择器中选择一天时做些什么，如下所示：

$('#details1 tr .ui-body-c').on('click', function(){ 
    $('#details1 .hasDatepicker').hide(); 
    if($('#date1').val()!="") 
    { 
     var day=new Date($('#date1').val()); 
     day.setHours(23); 
     day.setMinutes(59); 
     day.setSeconds(59); 

     getDayData(day); 
    } 
}); 

但是，点击当天不会触发点击事件。如果我从选择器中删除＃details1，则会触发事件，但会同时使用两个日期选择器。

这里的日期选择器插件的链接：http://jquerymobile.com/demos/1.0a4.1/experiments/ui-datepicker/

编辑：看来，表的jQuery移动日期选择器创建页面内没有检测到。我甚至试过这个：

$('html tr .ui-body-c').on('click', function(){ 
    $('#details1 .hasDatepicker').hide(); 
    if($('#date1').val()!="") 
    { 
     var day=new Date($('#date1').val()); 
     day.setHours(23); 
     day.setMinutes(59); 
     day.setSeconds(59); 

     getDayData(day); 
    } 
}); 

并没有工作。也做了var a = $('.datepicker-calendar').parent()，结果得到了[]。

有关为什么会发生这种情况以及如何解决它的任何想法？

Answer 1

我通过编辑jquery.ui.datepicker.mobile.js文件，为元素添加一个自定义类来解决此问题。

if(options.altField!=undefined) 
    $(dp).attr('id', options.altField.split('#')[1] + '1'); 

然后在function updateDatepicker(){

$(".ui-datepicker-calendar td", dp).addClass("ui-body-c "+$(dp).attr('id')+'2'); 

所以，如果我的日期输入的ID是 “myDatePicker”，在日历上都会有类 “myDatePicker12” 每个TD，我可以这样做：

$('.myDatePicker12').on('click', function(){ 
    $('#details1 .hasDatepicker').hide(); 
    if($('#date1').val()!="") 
    { 
     var day=new Date($('#date1').val()); 
     day.setHours(23); 
     day.setMinutes(59); 
     day.setSeconds(59); 

     getDayData(day); 
    } 
}); 

Answer 2

编辑：我的歉意，我应该仔细看看datepicker的移动版本。你的问题很可能是由于它添加表到DOM后，您将需要从一些静态的如委托事件：

$('#details1').on('click', 'tr .ui-body-c', function(){ 

---

如果日期选择器的移动版本是一样的正常的jQuery UI，你会过得更好使用onSelect事件，当你第一次初始化，像：

$('#details1').datepicker({ 
    onSelect: function(dateText, inst) { 
     inst.input.hide(); 
     var day=new Date(dateText); 
     day.setHours(23); 
     day.setMinutes(59); 
     day.setSeconds(59); 

     getDayData(day); 
    } 
});​ 

当您选择每天触发此事件，dateText是将投入输入值（无需要自己弄明白），inst是包含t的datepicker实例他输入问题（inst.input）。