1. 加入日期选择框
$("#dd").datebox({"required":true});
在id为dd的input type=text的输入框加入iquery easyui的日期选择框,且该日期必须输入时,使用(required: true),否则使用required:false;
2. javascript获取日期选择框的值
$("#dd").datebox("getValue");
当然这种方式不是太符合我们习惯,那么我们可以给它添加一个事件监听,在datebox onSelect 日期选中后,自动为input id="dd" type="text"赋值,然后我们就可以使用
$("#dd").val()获取选中的日期值了。
<script type="text/javascript">
$(document).ready(function(){
$("#dd").datebox({
required:true,
onSelect: function(date){
$("#dd").val(date);
}
});
});
</script>
3. javascript设置datebox的值
$("#dd").datebox("setValue", "2012-01-01");
补充:
需求场景:当我们需要把datebox中的设置的值,取得后返回一个Date类型的时候,就发现有些不好办了?
错误用法
var tempStr = $("#dd").datebox("getValue");
var tempDate = new Date(tempStr);
return tempDate;
发现在FireFox下,这样做是没有问题的;但是IE下就不起作用了,datebox("getValue")能返回正确的只字符串,例如“2012-01-01",但是new Date(str)的时候返回为NaN;
查了下Date的API发现,new Date(str) 调用了 Date.parse(str) 函数, 但是在IE下该函数默认支持Str格式为:
MM-dd-yyyy HH:mm:ss所以我们给定的字符串不是这种格式的,那么就解析不了。
找到原因之后,就好解决了,下面提供一个自己是是实现的函数 parseDate(dateStr)
/**
* 解析输入的dateStr,返回Date类型。
* dateStr: XXXX-XX-XX
*/
function parseDate(dateStr){
var strArray = dateStr.split("-");
if(strArray.length == 3){
return new Date(strArray[0], strArray[1], strArray[2]);
}else{
return new Date();
}
}