jQuery UI Datepicker中文显示

简介: jqueryuifunction [javascript] view plaincopy jQuery UI Datepicker这个用于日期显示很方便而且提供了多种样式,可以从jQuery UI中选择喜欢的样式和jQuery UI组件随意下载js库,如果只是使用datepicker那么选择时之选UI Core和Widgets中的Datepicker,然后选择喜欢的主题,选择版本,下载即可。

[javascript]  view plain copy
  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.  });  


目录
相关文章
|
JSON 前端开发 JavaScript
【前端】使用jQuery封装一套UI组件 - 级联选择器组件
本篇文章来讲解下级联选择器组件 级联选择器,在实际项目中也是比较常用的组件,比如:省市区三级关联,上下级联动等 最后面会附上全部代码
1328 0
|
5月前
|
Web App开发 缓存 JavaScript
JQuery Kendo UI使用技巧总结
JQuery Kendo UI使用技巧总结
39 4
|
6月前
|
前端开发
element-ui组件DatePicker日期选择器移动端兼容
element-ui组件DatePicker日期选择器移动端兼容
element-ui组件DatePicker日期选择器移动端兼容
jquery-easyui和jquery-ui的slider冲突解决
jquery-easyui和jquery-ui的slider冲突解决
|
JavaScript
vue element-ui (DatePicker)日期选择器获取开始时间和结束时间-均为yyyy-MM-dd 格式
vue element-ui (DatePicker)日期选择器获取开始时间和结束时间-均为yyyy-MM-dd 格式
374 0
|
JavaScript
关于Element-Ui 时间范围选择器DatePicker禁用范围日期问题
饿了么组件库的[DatePicker](https://element.eleme.cn/#/zh-CN/component/date-picker) 日期范围选择,
|
JavaScript 前端开发 程序员
【前端】使用jQuery封装一套UI组件 - 是和否滑动切换组件
本篇文章来讲解下是和否的滑动切换组件 切换滑动组件,使用的场景实际上就是一个开和关的场景,一般有是和否,开和关,禁用和启用等等,只需要设置0和1即可
147 0
|
JavaScript 前端开发 程序员
【前端】使用jQuery封装一套UI组件 - 可编辑下拉框组件
下拉框也是比较常用的组件,对应原生的下拉标签就是select 本篇文章就来讲讲可编辑下拉框组件的封装过程
363 0
|
JavaScript 前端开发 程序员
【前端】使用jQuery封装一套UI组件 - 移动端时间选择组件
【首先要声明一点,技术不分好坏,能用好就行,不用鄙视老技术】 今天要给大家展示的是移动端时间选择组件 最开始,看到比较新颖的移动端时间选择组件是在某款手机上,分年月日下拉选择,UI界面也挺好看的 除了讲解实现的步骤以及关键点,文章最后面会有完整的代码
242 0
|
前端开发 JavaScript 程序员
【前端】使用jQuery封装一套UI组件 - 单选框
目前前端技术发展非常快,各大厂都开源和分享了自家的前端框架,非常多成熟的UI组件供大家选择,很实用也很方便,给开发上节省了不少时间成本,当然少不了学习成本,不过也不会占用太多时间,只要有前端基础的话,原理基本都是通用的,只是写法不一样。 因此,除了学习现有的优秀前端之外,最好能自己根据原理封装一套自己的UI组件,目的是为了更好的理解前端知识点以及锻炼编程逻辑
166 0

相关课程

更多