尝试JQuery的日期插件

新年伊始，折腾了一把x61。农历年一过又回头清理了一把t61，把ssd+硬盘托架又换到了t61上。顶着显卡门的隐患重新启用t61作为主力机器，相比之下还是小T比较快啊，写代码心理感觉更爽了一点，哈哈。JQuery用的不能说熟练，但是简单的东西还是会用。之前struts2的日期标签用着很不爽，所以想到了JQuery的UI插件里面的日期插件就拿来尝试一下，感觉灰常的好。按照附带的demo稍微改了一下，先看看效果吧：
[img]http://dl.iteye.com/upload/attachment/206469/09ca3634-7754-31e6-bfdd-e5ef5b8d4cec.png[/img][img]http://dl.iteye.com/upload/attachment/206471/e40c77b8-f55d-329c-b4f9-df9a5053c6be.png[/img]

<script type="text/javascript">
	function datePicker(pickerName,locale) {
		$(pickerName).datepicker($.datepicker.regional[locale]);
		$(pickerName).datepicker('option', 'changeMonth', true);//月份可调
		$(pickerName).datepicker('option', 'changeYear', true);//年份可调
	}

	$(function() {
		//var locale = "<s:property value='#request.locale'/>";//struts2取语言环境
		//var locale = "<%=request.getLocale()%>"; //jsp取浏览器语言环境
		//datePicker('#dateDemo',locale);//根据语言环境切换日期控件语言
		datePicker('#dateDemo','zh_CN');
		//datePicker('#dateDemo',''); //''默认的样式在ui.datepicker.js内已定义为英文样式，与附件内的ui.datepicker-en_US.js相同
	});
</script>
...
<div>
	<p>日期: <input type="text" id="dateDemo"/> 
</div>

datePicker(...)是主要调用日期插件的方法，其中的option是插件的微调选项，日期格式等等都可以通过修改相应的属性值调整。
$(function(){...});完整形式为$(document).ready(function(){...});即为在DOM加载完毕后执行了ready()方法。这里传递id为dateDemo的input和表示中文的zh_CN给datePicker()初始化日期控件。第二个参数可以通过注释的两种或者其他的方式获取客户端的语言环境进行设置。附件内的ui.datepicker-zh_CN.js和ui.datepicker-en_US.js分别单独定义了不同语言环境的样式。

这样简单的效果就基本上实现了，值得注意的是如果出现了乱码的情况则要检查ui.datepicker-locale.js文件的编码是否正确。个人感觉JQuery不仅仅兼容主流浏览器提高开发的效率，而且对于像我这样JS不怎么好的开发人员来说提供了缩小差距的机会。灰常符合其"write less, do more"的指导方针。