jQuery选择器与jquery-mobile datepicker不能很好地工作
在我的html中,我有两个不同的日期选择器,在两个不同的divs内。我想从日期选择器中选择一天时做些什么,如下所示:jQuery选择器与jquery-mobile datepicker不能很好地工作
$('#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()
,结果得到了[]。
有关为什么会发生这种情况以及如何解决它的任何想法?
我通过编辑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);
}
});
编辑:我的歉意,我应该仔细看看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)。
这不起作用。当页面加载jquery-mobile datepicker脚本时,会在每个输入类型=“日期”上生成一个日期选择器。它是一些内嵌表格的嵌套div,并绑定了单击事件以选择您点击的日期,因此.datepicker方法不起作用。 – mornaner 2012-07-18 14:36:21
好吧,那有点糟糕 - 请问您可以发布您的标记吗? – Tjkoopa 2012-07-18 14:43:31
#details1是我的那个页面的包装div。还尝试与其他更接近桌子的div,但没有得到任何东西。 – mornaner 2012-07-18 14:45:31