这几天在折腾 jquery 和 html5 的demo,在做到 jquery 的datepicker 组件时出现了一些问题:
一般的我们在页面加载完成后就绑定datepicker,即:
$(function() {
$( "#datepicker" ).datepicker({ minDate: '07/02/2011', maxDate: "+1M +10D" });
});
但是我的demo中是这样的:用户需要把想要的操作拖拽到可操作区域中去,然后在区域中生成一个操作项,操作项有开始时间和结束时间,这里的datepicker是需要在用户拖拽后才能绑定的,所以,我需要在用户拖拽后,对所有操作项都执行上面的代码(这里之前存在的项就会被设置多次),而不是在页面加载成功后。
1. 如果我修改了操作项的时间后,又拖拽了一个操作项进来,那么之前的时间就会恢复到默认值,这就是一个bug。后来我才发现,拖拽进来时的语句是:obj.innerHTML+=“...”。
我想到应该是js在处理这句语句时,之前修改过的时间没有被js记录下来,而是直接用的默认值,这可怎么好,郁闷,后来终于找到了jquery的 .append()方法,用这句话就没有问题,它只是在目前的基础上加上一些html代码,而没有重新组织后再显示,就避免了恢复默认值的问题。
2. 我试过两个datepicker先后添加到同一元素上,而结果是如果元素已经有了datepicker,就不会再次创建了。如果后一次的数据与前一次的不一样,比如:默认最小值是7月2号,但是当我选择了开始时间后,结束时间中的最小值应该变成开始时间。这种情况下就需要先把之前的datepicker删除掉再次赋值:
var min=$("#startTime").val();
obj.datepicker( "destroy" );
obj.datepicker({ minDate:min, maxDate: "+1M +10D" });