jquery的date input日期组件使用


jquery的date input日期选择控件,在一些日期表单上使用,效果还是比较好的。

官方介绍和下载地址 http://jonathanleighton.com/projects/date-input/

使用前需要导入jquery库和date input的库和css文件
<script type="text/javascript" src="js/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="js/jquery.date_input.js"></script>
<link rel="stylesheet" href="css/date_input.css" type="text/css">

官网下载的包里就包含了js和css文件。

 使用前先改变默认的日期格式,下面是中文日期。参数设置都很简单,就是最后的dateToString参数值是返回的日期格式,这里是 年-月-日 的格式。可以自己更改。

$.extend(DateInput.DEFAULT_OPTS, { month_names: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],
	short_month_names: ["一", "二", "三", "四", "五", "六", "七", "八", "九", "十", "十一", "十二"], 
	short_day_names: ["日","一", "二", "三", "四", "五", "六"],
	dateToString: function(date) {
	    var month = (date.getMonth() + 1).toString();//月份
	    var dom = date.getDate().toString();//日
	    if (month.length == 1) month = "0" + month;//控制月份为10一下的显示为01格式
	    if (dom.length == 1) dom = "0" + dom;//同月份
	    return date.getFullYear() + "-" + month + "-" + dom;
	  }
	}
);

 *在下载的压缩包里,有个translations目录,里面有默认语言的日期设置,jquery.date_input.zh_CN.js就是中文日期,不过他的short_day_names参数是["一", "二", "三", "四", "五", "六","日"]。星期日和一显示不对。

响应inpu组件代码

$(function(){$("#birthday").date_input();});

birthday是组件ID

<input readonly  id="birthday" type="text" name="birthday" size="20">

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值