乌徒帮技术范儿WEB开发jQuery › jQuery日期选择器插件date-input

jQuery日期选择器插件date-input

分类:jQuery

这个jQuery插件可以帮助开发者提供一个快速的日期选择器(如下图),帮助开发者简单的实现日期选择,让使用用户无需自己填写日期就可以插入日期。

官网:http://jonathanleighton.com/projects/date-input/

下载:

http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js
http://github.com/jonleighton/date_input/raw/master/jquery.date_input.js
http://github.com/jonleighton/date_input/raw/master/date_input.css

中文支持:

jQuery.extend(DateInput.DEFAULT_OPTS,{
	month_names: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],   
	short_month_names: ["一", "二", "三", "四", "五", "六", "七", "八", "九", "十", "十一", "十二"],   
	short_day_names: ["一", "二", "三", "四", "五", "六", "日"]
});

说明:默认是日期格式很不好,需要修改。

全部代码:

?<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> ?
<html xmlns="http://www.w3.org/1999/xhtml"> ?
<head> ?
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> ?
<title>日历</title> ?
<script type="text/javascript" src="jquery-1.3.2.js"></script>? ?
<script type="text/javascript" src="jquery.date_input.js"></script>? ?
<link rel="stylesheet" href="date_input.css" type="text/css">? ?
<script> ?
jQuery.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; ?
??? if (dom.length == 1) dom = "0" + dom; ?
??? return date.getFullYear() + "-" + month + "-" + dom; ?
? } ?
? 
});? ?
? 
$(function() {? ?
$(".biuuu1").date_input();? ?
$(".biuuu2").date_input();? ?
});? ?
</script> ?
</head> ?
? 
<body> ?
<input type="text" name="date"/>? ?
<input type="text" name="date"/>? ?
</body> ?
</html>
填写个人信息,赶快回复吧!