jQuery UI Datepicker中文显示

jqueryuifunction

[javascript] view plaincopy

1. jQuery UI Datepicker这个用于日期显示很方便而且提供了多种样式，可以从jQuery UI中选择喜欢的样式和jQuery UI组件随意下载js库，如果只是使用datepicker那么选择时之选UI Core和Widgets中的Datepicker，然后选择喜欢的主题，选择版本，下载即可。  
2.   
3. 不过下载的jQuery UI库中是没有中文的，我们可以将如下js代码放到一个js文件中，然后在文件中引用即可：jQuery(function($){   
4.      $.datepicker.regional['zh-CN'] = {   
5.         clearText: '清除',   
6.         clearStatus: '清除已选日期',   
7.         closeText: '关闭',   
8.         closeStatus: '不改变当前选择',   
9.         prevText: '<上月',   
10.         prevStatus: '显示上月',   
11.         prevBigText: '<<',   
12.         prevBigStatus: '显示上一年',   
13.         nextText: '下月>',   
14.         nextStatus: '显示下月',   
15.         nextBigText: '>>',   
16.         nextBigStatus: '显示下一年',   
17.         currentText: '今天',   
18.         currentStatus: '显示本月',   
19.         monthNames: ['一月','二月','三月','四月','五月','六月', '七月','八月','九月','十月','十一月','十二月'],   
20.         monthNamesShort: ['一','二','三','四','五','六', '七','八','九','十','十一','十二'],   
21.         monthStatus: '选择月份',   
22.         yearStatus: '选择年份',   
23.         weekHeader: '周',   
24.         weekStatus: '年内周次',   
25.         dayNames: ['星期日','星期一','星期二','星期三','星期四','星期五','星期六'],   
26.         dayNamesShort: ['周日','周一','周二','周三','周四','周五','周六'],   
27.         dayNamesMin: ['日','一','二','三','四','五','六'],   
28.         dayStatus: '设置 DD 为一周起始',   
29.         dateStatus: '选择 m月 d日, DD',   
30.         dateFormat: 'yy-mm-dd',   
31.         firstDay: 1,   
32.         initStatus: '请选择日期',   
33.         isRTL: false};   
34.         $.datepicker.setDefaults($.datepicker.regional['zh-CN']);   
35.     });  
36.   
37. 注意保存时需要把编码方式选为UTF-8，如果是使用记事本或者Ediplus另存为时可以选择。  
38.   
39.    
40.   
41.    
42.   
43.  $(function() {  
44.   $.datepicker.setDefaults($.extend({showMonthAfterYear: false}, $.datepicker.regional['']));  
45.   $("#datepicker").datepicker($.datepicker.regional['fr']);  
46.   $("#locale").change(function() {  
47.    $('#datepicker').datepicker('option', $.extend({showMonthAfterYear: false},  
48.     $.datepicker.regional[$(this).val()]));  
49.   });  
50.  });