现在的位置: 首页 > 综合 > 正文

easyui的datebox和datetimebox的设置输出日期的格式

2014年10月06日 ⁄ 综合 ⁄ 共 2152字 ⁄ 字号 评论关闭
easyui的datebox和datetimebox的设置输出日期的格式
2011-04-20 12:36

参考文章:

http://www.ityizhan.com/jquery-easyui-%E6%97%A5%E6%9C%9F%E6%A1%86datebox%E7%94%A8%E6%B3%95/

http://archive.cnblogs.com/a/2009818/

这个属于jquery的easy ui里的。

datebox和datetimebox的默认日期格式都是dd/mm/yyyy。

有两种方式可以设置输出日期格式:

1.在easy-ui的下载包中,query-easyui-1.2.2\locale中,把easyui-lang-zh_CN.js加入项目,默认的日期格式为 yyyy-mm-dd。

2.如果想自定义成我们的格式需要实现两个函数,formatter和parser。 

formatter函数使得选择日期后将其格式化为我们需要的格式,parser函数在选择好日期后告诉控件如何去解析我们自定义的格式。 

定义如下: 
formatter:A function to format the date, the function take a 'date' parameter and return a string value. 
parser:A function to parse a date string, the function take a 'date' string and return a date value. 

如将日期格式化为yyyy-mm-dd的格式:

$('#dd1').datebox({

formatter: function(date){ return date.getFullYear()+'-'+(date.getMonth()+1)+'-'+date.getDate(); }, 

 parser: function(date){ return new Date(Date.parse(date.replace(/-/g,"/"))); }

 });

 

 

 

 

 

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>jQuery EasyUI</title>

<link rel="stylesheet" type="text/css" href="../themes/default/easyui.css">

<link rel="stylesheet" type="text/css" href="../themes/icon.css">

<script type="text/javascript" src="../jquery-1.4.4.min.js"></script>

<script type="text/javascript" src="../jquery.easyui.min.js"></script>

<script>

function disable(){

$('#dd').datebox('disable');

}

function enable(){

$('#dd').datebox('enable');

}

//设置datebox的当前日期,日期格式等等。

$("#dd").datebox({

currentText :Today,

formatter: function(date){ return date.getFullYear()+'-'+(date.getMonth()+1)+'-'+date.getDate(); }, 

 parser: function(date){ return new Date(Date.parse(date.replace(/-/g,"/"))); }

});

</script>

</head>

<body>

<h1>DateBox</h1>

<div style="margin-bottom:10px;">

<a href="#" onclick="disable()">disable</a>

<a href="#" onclick="enable()">enable</a>

</div>

<input id="dd" class="easyui-datebox" required="true"></input>

</body>

</html>

下面是datebox的属性列表

currentText 字符串 为当前日期按钮显示的文本 Today
closeText 字符串 关闭按钮显示的文本 Close
disabled 布尔 如果为true则禁用输入框 false
required 布尔 定义输入框是否为必添 false
missingMessage 字符串 当输入框为空时提示的文本 This field is required.
formatter function 格式化日期的函数,这个函数以’date’为参数,并且返回一个字符串  
parser function 分析字符串的函数,这个函数以’date’为参数并返回一个日期

 

抱歉!评论已关闭.